定位

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

• relative 生成相對定位元素，元素所占據的文檔流的位置不變，元素本身相對文檔流的位置進行偏移
• absolute 生成絕對定位元素，元素脫離文檔流，不占據文檔流的位置，可以理解為漂浮在文檔流的上方，相對于上一個設置了相對或者絕對或者固定定位的父級元素來進行定位，如果找不到，則相對于body元素進行定位。
• fixed 生成固定定位元素，元素脫離文檔流，不占據文檔流的位置，可以理解為漂浮在文檔流的上方，相對于瀏覽器窗口進行定位。
• static 默認值，沒有定位，元素出現在正常的文檔流中，相當于取消定位屬性或者不設置定位屬性

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

定位元素特性

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

定位元素層級

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

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