學習雜記（如何讓兩個div在同一行）

時不時會要記著一些東西，以防自己忘記總結。

css浮動

div是塊級元素，在頁面中獨佔一行，自上而下排列，也就是傳說中的流。

在div的標準流中，無論div多小，它都獨佔一行，相互沒有交集。

但是很多地方要使兩個或者多個div處於一行，這時候要對操作div設定浮動屬性。設定浮動後就不再屬於標準流，成為乙個新的流。又因為浮動是漂浮在標準流之上的。所以剛設定會出現下圖情況。（div2是設定的浮動屬性：左浮動(float:left;)）

如果我們把div2採用右浮動

就會變成這樣。

當設定了多個浮動div元素後，把div2和div3都加上左浮動

由於div2、div3浮動，它們不再屬於標準流，因此div4會自動上移，與div1組成乙個「新」標準流，而浮動是漂浮在標準流之上，因此div2又擋住了div4。

總結下重點

假如某個div元素a是浮動的，如果a元素上乙個元素也是浮動的，那麼a元素會跟隨在上乙個元素的後邊(如果一行放不下這兩個元素，那麼a元素會被擠到下一行)；如果a元素上乙個元素是標準流中的元素，那麼a的相對垂直位置不會改變，也就是說a的頂部總是和上乙個元素的底部對齊。

div的順序是html**中div的順序決定的。

靠近頁面邊緣的一端是前，遠離頁面邊緣的一端是後。