定位

關於定位

我們可以使用css的position屬性來設定元素的定位型別，postion的設定項如下：

• relative 生成相對定位元素，元素所佔據的文件流的位置不變，元素本身相對文件流的位置進行偏移
• absolute 生成絕對定位元素，元素脫離文件流，不佔據文件流的位置，可以理解為漂浮在文件流的上方，相對於上一個設定了相對或者絕對或者固定定位的父級元素來進行定位，如果找不到，則相對於body元素進行定位。
• fixed 生成固定定位元素，元素脫離文件流，不佔據文件流的位置，可以理解為漂浮在文件流的上方，相對於瀏覽器視窗進行定位。

• static 預設值，沒有定位，元素出現在正常的文件流中，相當於取消定位屬性或者不設定定位屬性

    relative 相對定位,不脫離文件流,相對於自己本身的位置進行定位,
    absolute 絕對定位,脫離文件流,位置相對於已定位的父級,
    如果沒有父級,或父級沒有定位,那麼相對於文件的00點 (body)
  
    fixed 固定定位,脫離文件流,位置相對於瀏覽器視窗 進行定位
  

定位元素特性

絕對定位和固定定位的塊元素和行內元素會自動轉化為行內塊元素

定位元素層級

定位元素是浮動的正常的文件流之上的，可以用z-index屬性來設定元素的層級

典型定位佈局

1、固定在頂部的選單 2、水平垂直居中的彈框 3、固定的側邊的工具欄 4、固定在底部的按鈕