在浮動元素末尾新增乙個空的標籤例如
，其他標籤br等亦可。
class="warp"
id="float">class="main left">.maindiv>
class="side left">.sidediv>
div>
div>
優點：通俗易懂，容易掌握
缺點：：可以想象通過此方法，會新增多少無意義的空標籤，有違結構與表現的分離。
通過設定父元素overflow值設定為hidden；在ie6中還需要觸發 haslayout ，例如 zoom：1；
class="warp"
id="float" style="overflow:hidden; *zoom:1;">class="main left">.maindiv>
class="side left">.sidediv>
div>
優點：不存在結構和語義化問題，**量極少
缺點：內容增多時候容易造成不會自動換行導致內容被隱藏掉，無法顯示需要溢位的元素；
通過設定父元素overflow值設定為hidden；在ie6中還需要觸發 haslayout ，例如 zoom：1；
class="warp"
id="float" style="overflow:auto; *zoom:1;">class="main left">.maindiv>
class="side left">.sidediv>
div>
優點：不存在結構和語義化問題，**量極少
缺點：多個巢狀後，firefox某些情況會造成內容全選；ie中 mouseover 造成寬度改變時會出現最外層模組有滾動條等，firefox早期版本會無故產生focus等。
由於ie6-7不支援:after，使用 zoom:1觸發 haslayout。
.clearfix
:after
.clearfix
.clearfix
:after
缺點：復用方式不當會造成**量增加
優點：簡單，**少，容易掌握
缺點：只適合高度固定的布局，要給出精確的高度，如果高度和父級div不一樣時，會產生問題
CSS 清除浮動的幾種常用方法
本文總結自，b站 pink老師 鳴謝 為什麼要清除浮動？由於父級盒子很多情況下，不方便給高度，但是子盒子浮動又不占有位置，最後父級盒子高度為零時就會影響下面的標準流盒子。清除浮動語法 選擇器 屬性及描述 屬性值描述left 不允許左側有浮動元素 清除左側浮動的影響 right 不允許右側有浮動元素 ...
css幾種清除浮動的方法
在div css布局時，為了實現多種布局，會用到浮動。但是不清除浮動也會產生一些問題。1 設定浮動會被塊級兄弟元素覆蓋 我設定了浮動但是沒有背景色 我沒有設定浮動，但是有背景色 body div1 div blank div blue2 父元素高度塌陷 我是塊元素，設定了浮動 我是span，沒有設定...
清除浮動的幾種常用方法
首先，浮動這個樣式的出現，僅僅只是為了實現 環繞的效果，現在大多時利用浮動來布局 浮動 使元素推理文件流，按照指定方向發生移動 遇到父級邊界或者相鄰的浮動元素會停下來 浮動的特性 1，塊元素一行顯示多個 2，內聯元素支援寬高 3，沒有設定寬度時由內容撐開寬度 4，脫離文件流 浮動的破壞性 浮動元素脫...