元素包括塊級元素和行級元素，塊級元素獨佔一行(可設定寬高)，行級元素(不能設定寬高)、行塊元素(能設定寬高)並排顯示。

正常文件流從上往下，從左往右。

元素從文件流中脫離後，不再佔用文件流的位置，所以該元素下邊的還在文件流中的其他元素會自動向上移動。
因為元素從文件流中脫離後與文件流無關，所以它們可以覆蓋頁面上的其它元素。

樣式疊加(權重)、元素不繼承邊框和寬高。

1 float定位
（1）浮動元素非完全脫離文件流。
float的元素脫離正常的文件流，但是還會佔據文件流的文字空間，比如float應用於影象，使文字環繞在其周圍。
（2）設定浮動以後元素會向父元素的左側或者右側移動。
（3
 
）浮動元素預設不會從父元素中移出。
（4）浮動元素向左或者右移動時，不會超過他前邊的其他浮動元素。
（5）如果浮動元素上邊是一個沒有浮動的塊元素，則浮動元素無法上移。
（6）浮動元素不會超過它上邊的浮動的兄弟元素，最多就是和他一樣高。
（7）主要作用就是讓頁面中的元素可以水平排列。
（8）脫離文件流的特點如下
1）塊元素:   不再獨佔一行，且塊元素的高度寬度預設被內容撐開，如果不設定寬高的話。
2）行內元素: 脫離文件流後會變成塊元素，特點和塊元素一樣，可以設定寬高等屬性。
（9）float能引起父元素的高度塌陷
在浮動佈局中，父元素的高度是被子元素撐開的，當子元素浮動後，子元素從文件流中脫離，將無法撐起父元素的高度，導致
父元素高度缺失。父元素高度缺失以後，其下的元素會自動上移，導致頁面佈局混亂。float引起的高度塌陷則是可清除的，我
們常說的清除浮動就是指清除float帶來的高度塌陷問題，比如父元素開啟BFC，overflow: hidden。
（
 
10）clear
如果我們不希望某個元素因為其他元素浮動的影響而改變位置，可以通過clear屬性來清除浮動元素對當前元素的影響。

2 relative定位
（1）元素開啟相對定位後，如果不設定偏移量，則元素不會發生任何變化。
（2）相對定位會按照元素的原始位置對該元素進行移動。
（3）相對定位會提升元素的層級。
z-index屬性
（4）相對定位不會使元素脫離文件流。
元素框偏移某個距離，元素仍保持其未定位前的形狀，它原本所佔的空間仍保留。
（5）相對定位不會改變元素的性質，塊還是塊，行內還是行內。

3 absolute定位
（1）開啟絕對定位後，如果不設定偏移量，元素的位置不會發生改變。
（
 
2）絕對定位元素是相對於其開啟了定位的包含塊進行定位。
包含塊就是離當前元素最近的祖先塊元素;在絕對定位中，如果所有的祖先塊元素都沒有開啟定位，則根元素就是他的包含塊。
（3）絕對定位會提升元素的層級。
z-index屬性
（4）開啟定位後，元素從文件流中完全脫離。
通過絕對定位，元素可以放置到頁面上的任何位置。
（5）絕對定位會改變元素的性質，行內元素變成塊元素，塊元素的寬高被內容撐開。
（6）absolute能引起父元素的高度塌陷
由於absolute是完全脫離文件流，所以這種情況的高度塌陷是沒辦法清除的。

4 fixed定位
元素框的表現類似於將 position 設定為 absolute，唯一不同的是固定定位永遠參照於瀏覽器的視口定位。固定定位的元素不會隨著滾動條滾動。

5 sticky定位
粘滯定位和相對定位基本一致，不同的是粘滯定位可以在元素達到某一位置時將其固定。