為什麼要清除浮動？
清除浮動主要是為了解決，父元素因為子級元素浮動引起的內部高度為0的問題
1.如下，我給父盒子設定乙個boder，內部放兩個盒子乙個big 乙個small，未給big和small設定浮動，則他們會預設撐開父盒子
2.當我給內部兩個盒子加上float屬性的時候
頂部深藍色盒子就會頂上來，然後父盒子因為沒設定高度，變成一條線，big和small已經浮動了
總結一下：
當父元素不給高度的時候，
內部元素不浮動時會撐開
而浮動的時候，父元素變成一條線
什麼是clear：both
clear：both：本質就是閉合浮動， 就是讓父盒子閉合出口和入口，不讓子盒子出來
document
big
small
額外標籤法
此時
如果我們清除了浮動，父元素自動檢測子盒子最高的高度，然後與其同高。
優點：通俗易懂，方便
缺點：新增無意義標籤，語義化差
不建議使用。
2.父級新增overflow屬性（父元素新增overflow:hidden）（不推薦）
通過觸發bfc方式，實現清除浮動
.fahter缺點：內容增多的時候容易造成不會自動換行導致內容被隱藏掉，無法顯示要溢位的元素
不推薦使用
3.使用after偽元素清除浮動（推薦使用）
.clearfix:after
.clearfix
small
優點：符合閉合浮動思想，結構語義化正確
缺點：ie6-7不支援偽元素：after，使用zoom:1觸發haslayout.
推薦使用
4.使用before和after雙偽元素清除浮動
.clearfix:after,.clearfix:before
.clearfix:after
.clearfix
small
優點：**更簡潔
缺點：用zoom:1觸發haslayout.
推薦使用
清除浮動的最常用的四種方法，以及優缺點
bigsmall 額外標籤法 優點 通俗易懂，方便 缺點 新增無意義標籤，語義化差 fahter優點 簡潔 缺點 內容增多的時候容易造成不會自動換行導致內容被隱藏掉，無法顯示要溢位的元素 clearfix after clearfix bigsmall 優點 符合閉合浮動思想，結構語義化正確 缺點 ...
浮動的清除 四種方法
原文 前言 乙個父親不能被自己浮動的兒子，撐出高度。我們本以為這些li，會分為兩排，但是，第二組中的第1個li，去貼靠第一組中的最後乙個li了。第二個div中的li，去貼第乙個div中最後乙個li的邊了。原因就是因為div沒有高度，不能給自己浮動的孩子們，乙個容器。只要浮動在乙個有高度的盒子中,那麼...
清除浮動的四種方法
今天面試 被問了乙個常考的問題 如何清除浮動，本身這個技術沒總結過，加上嘴笨 回答的不怎麼樣，於是簡單的整理一下 1.為什麼清除浮動 總是要清除浮動，為什麼呢，使用浮動之後出現什麼預期之外的顯示效果要清除浮動，總結一下，我認為是為了解決浮動帶來的高度塌陷 2.高度塌陷 先給乙個父元素 只設定寬度，不...