其實浮動我是這麼理解的，讓某個元素，脫離原來的標準流，浮動在標準流之上，它擁有自己的浮動流，和標準流不是乙個層次上的。
首先呢， fnncat 來給建立四個有顏色的色塊，為了方便理解他們浮動的具體位置。
一，畫四個色塊，沒有浮動。
這是最開始的樣子，div是塊級元素，在頁面中獨佔一行，自上而下排列，也就是傳說中的流。
二，使其中乙個色塊浮動，觀察其變化
fnncat 把第二個塊浮動屬性設定為 left 可以看的出第三個塊被第二個塊給遮住了。
fnncat 把第二個塊浮動屬性設定為 right 可以看的出第二塊往右便去了。
三，為了更加清楚的看清出浮動屬性的影響，我們將兩個色塊加入向右的浮動，並改變瀏覽器視窗大小，方便看出浮動流與本身文件流的具體排布。
當視窗為1337px
當視窗為899px 可以看的出第三個還是緊跟著第二個排列在最右邊
繼續把視窗拉小，當前視窗為627px,就看見第四個色塊被遮住了。
fnncat 再拉小視窗，視窗寬度為515px,當第二個色塊與第三個色塊的寬度（這裡還有body的左右外邊距和16px）大於視窗寬度時，
第三個色塊，被擠了下來，放在了第二個色塊之下
如果改變第二個和第四個色塊的浮動屬性，變為向左浮動，怎會變成下面的樣子。
~~~是不是，可以通過以上實驗，可以看的出**是標準流，**是浮動的。
額，假如某個div元素a是浮動的，如果a元素上乙個元素也是浮動的，那麼a元素會跟隨在上乙個元素的後邊(
div的順序是html**中div的順序決定的。
靠近頁面邊緣的一端是前，遠離頁面邊緣的一端是後。
這段是別人總結的拿過總結一下，哈。
四，接下來是清除浮動（打破橫向排列）
語法：clear : none | left | right | both
取值：none : 預設值。允許兩邊都可以有浮動物件
left : 不允許左邊有浮動物件
right : 不允許右邊有浮動物件
both : 不允許有浮動物件
~~clear清除浮動，只能影響清除元素本身，不能影響其他元素。
瀏覽器支援情況：基本上所有的主流瀏覽器都支援clear屬性。
為了描述的清楚點兒， fnncat 根據上面的浮動屬性，讓這四個色塊右浮動。
效果如下
那麼我們怎麼可以做到浮動清除呢，讓第乙個和第二個在第一行，而第三個與第四個色塊則在他們下面。
這樣，我們便用上了clear屬性，一定要記住，新增clear屬性時，這個規則只能影響使用清除元素的本身，不能影響其他元素。
這麼說，就是我們想讓第三個和第四個色塊下來，那麼我們不能設定第二個色塊的clear屬性,要設定第三個色塊的clear屬性，將其
設定為 right,這樣第三個色塊的右側浮動被清除，自然第三個色塊的右側便沒有了浮動元素，因此，第三個色塊變被迫到了下一行中
圖示如下
CSS 清理浮動 clear屬性
文章 雖然浮動可以便於頁面布局，但同時會產生一些問題，也就是常說的 浮動元素最常見的缺陷是 父元素的高度塌陷和影響兄弟元素的位置。首先，看看父元素的高度塌陷。假設有乙個容器，其中兩個子元素，乙個子元素向左浮動，乙個子元素向右浮動。如下 box2 圖5 29 浮動導致容器高度塌陷 這種塌陷會影響 甚至...
深入理解CSS清除浮動與clear屬性
相信作為一名前端工作人員，一定遇到過或是被問過清除浮動這一問題，一般我們會說 元素新增float屬性後，其父元素不會被撐開，解決這個問題的過程就稱為清除浮動。沒有問題，假如再深入問一點，為什麼新增float屬性之後會出現這樣的情況，有幾種清除浮動的方法。浮動的案例 父元素沒有被撐開 class co...
clear清除浮動標籤
1 清除浮動clear clear right 清除右浮動造成的影響 clear left 清除左浮動造成的影響 clear both 清除兩邊浮動造成的影響 注意 在浮動後面的盒子上設定清除樣式 即那個受影響就在誰上面設定 2 overflow 超出部分如何處理 overflow hidden 超...