基本網(wǎng)頁布局一般分為三種：
1）流式布局
2）浮動布局
3）絕對定位布局
css中的定位機制：
1）標準文檔流
特點：a.從上到下，從左到右，輸出文檔內(nèi)容；
b.由塊級元素和行級元素組成
（塊級元素：從左到右撐滿頁面，獨占一行；觸碰到頁面邊緣時，會自動換行；eg: div、ul、li、dl、dt、p）
（行級元素：能在同一行內(nèi)顯示；不會改變HTML文檔結(jié)構(gòu)；eg: span、strong、img、input）
（塊級元素和行級元素都是盒子模型）
2）浮動：通過float屬性實現(xiàn)橫向多列布局
3）絕對定位
盒子模型：
1）網(wǎng)頁布局的基石；
2）有四部分組成：邊框border、外邊距margin、內(nèi)邊距padding、盒子中的內(nèi)容content；
3）盒子3D模型：從上到下，依次為border、content+padding、backgroud-image、background-color、margin；
4）盒子模型尺寸=外邊距+邊框+內(nèi)邊距+盒子中內(nèi)容的尺寸
橫向兩列布局：
1.float屬性：使縱向排列的塊級元素橫向排列；
2.margin屬性：設(shè)置兩列之間的間距
position屬性：
1）擁有3種定位形式：
a.靜態(tài)定位; b.相對定位;c.絕對定位
2）可設(shè)置4個屬性值：
a. static（靜態(tài)定位）；
b. relative（相對定位）；
c. absolute（絕對定位）；
d. fixed（固定定位）
（絕對定位和固定定位都屬于絕對定位）
相對定位：
1）相對于自身原有位置進行偏移；
2）仍處于標準文檔流中；
3）隨即擁有偏移屬性和z-index屬性
絕對定位布局：
1）通過設(shè)置position屬性實現(xiàn)；
2）CSS中規(guī)定的第三種定位機制；
3）能夠?qū)崿F(xiàn)橫向多列布局及較為復(fù)雜的定位
絕對定位：
1）建立了以包含塊為基準的定位；
2）完全脫離了標準文檔流；
3）隨即擁有偏移屬性和z-index屬性
a) 未設(shè)置偏移量時：
無論是否存在已定位的祖先元素，都保持在元素初始位置，脫離了標準文檔流；
b)設(shè)置偏移量時，偏移參照基準為：
無已定位祖先元素，以<html>為偏移參照基準；
有已定位祖先元素，以距其最近的已定位祖先元素為偏移參照標準
c)當一個元素設(shè)置了絕對定位，沒有設(shè)置寬度時，元素的寬度根據(jù)內(nèi)容進行調(diào)節(jié)
使用absolute實現(xiàn)橫向兩列布局：
常用于一列固定寬度，另一列寬度自適應(yīng)的情況
主要應(yīng)用技能：
1）relative父元素相對定位；
2）absolute自適應(yīng)寬度元素絕對定位
（固定寬度列的高度>自適應(yīng)寬度的列的高度）
