浮動的元素不佔位置，在標準流中寬高為0，不能撐開父盒子，由於這種原因，則會導致下方的標準流盒子上移，會被上方未清除浮動的盒子覆蓋，影響頁面的布局
給浮動的盒子的父盒子新增乙個高度，因為浮動盒子不能撐開父盒子，那麼我們給父盒子加上高度就從根本上解決了這乙個問題，
缺點：浮動，給定盒子乙個寬度，導致其高度是等比例縮放的，這乙個高度值有很大的機率是很難計算出來的，這種情況就不能使用手動給定高度這一方法
額外標籤法，
在父盒子中，所有的浮動盒子之後新增乙個額外的標籤，
.clear 缺點，乙個頁面可能有很多地方需要清除浮動，這樣就需要使用很多無用的標籤給浮動盒子的父盒子也使用浮動，這樣浮動的盒子就能撐開其父盒子
缺點：雖然給父盒子使用浮動能夠達到清除內部浮動元素的目的，但是整體浮動同樣會影響到頁面的布局
使用css的overflow屬性
給浮動盒子的父盒子新增overflow:hidden;或overflow:auto;可以清除浮動，另外在 ie6 中還需要觸發 haslayout ，例如為父元素設定容器寬高或設定 zoom:1。
在新增overflow屬性後，浮動元素又回到了容器層，把容器高度撐起，達到了清理浮動的效果。
使用css的:after偽元素
結合 :after 偽元素（注意這不是偽類，而是偽元素，代表乙個元素之後最近的元素）和 iehack ，可以完美相容當前主流的各大瀏覽器，這裡的 iehack 指的是觸發 haslayout。
給浮動元素的容器新增乙個clearfix的class，然後給這個class新增乙個:after偽元素實現元素末尾新增乙個看不見的塊元素（block element）清理浮動。
.clearfix:after
.clearfix
五星推薦使用
通過上面的例子，我們不難發現清除浮動的方法可以分成兩類：
一是利用 clear 屬性，包括在浮動元素末尾新增乙個帶有 clear: both 屬性的空 div 來閉合元素，其實利用 :after 偽元素的方法也是在元素末尾新增乙個內容為乙個點並帶有 clear: both 屬性的元素實現的。
二是觸發浮動元素父元素的 bfc (block formatting contexts, 塊級格式化上下文)，使到該父元素可以包含浮動元素，關於這一點。
清除浮動的幾種方法
1.浮動元素下加空div 為了統一樣式，我們新建乙個樣式選擇器class命名為 clear 並且對應選擇器樣式為 clear both 然後我們在父級 結束前加此div引入class clear 樣式。這樣即可清除浮動。這個class 清除float產生浮動，可以不用對父級設定高度 也無需技術父級高...
清除浮動的幾種方法
當元素浮動時，他將不再處於普通文件流中，相當於浮在文件之上，不佔據空間，但是會縮短行寬，產生文字環繞的效果。浮動帶來的影響 1，父級的高度塌陷 2.背景不能顯示 3.變框不能撐開 4.margin值不能正確顯示 5.產生文字環繞的效果 6.由於脫離文件流，不佔位，而後面的元素未脫離文件流導致後面的元...
清除浮動的幾種方法
style float left 為了解決container容器高度塌陷問題，我們必須清除浮動 第一種方法 在container元素後加上乙個空的div標籤，然後給設定乙個clear both的樣式 第二種方法 給container容器新增 overflow auto hidden樣式 第三張方法 ...