首先了解兩個概念：

1. 文件流：文件流是文件中可顯示物件在排列時所佔用的位置。
2. 浮動的定義：使元素脫離文件流，按照指定方向發生移動，遇到父級邊界或者相鄰的浮動元素停了下來。

浮動的實際用途，可設定文字環繞或使元素寬度由內容填充（類似Inline-block)。使用浮動需要注意的是如果浮動的元素高度比父級容器還高，那麼需要設定父級容器的overflow屬性為auto,使其自動撐滿。

本人經常使用的清除浮動是使用以下這種（目前主流，可以把該樣式封裝在全域性，供一整個專案複用）
 

選擇符:after{ 
content:""; 
clear:both; 
display:block;
}

也有寫法把content設定為不為空

以上方法，未考慮ie6-7這老掉渣的版本（IE6，7下不相容 after偽類），相容方法新增如下樣式

選擇符{zoom:1;}

zoom:1; //     觸發 IE下 haslayout，使元素根據自身內容計算寬高

其他一些方法羅列（不齊全）

1、給父容器一個確定的高度
2、手動新增一個空div，並設定樣式{clear:both;}的

3、父元素增加樣式overflow:auto;