清除浮動的方法

爲何要清除浮動：在父盒子內部的元素具有浮動屬性時，內部元素脫離文檔流，內部元素沒法再撐開父盒子，致使父盒子高度塌陷。

1.添加額外空標籤：在浮動的子元素後面添加一個塊級標籤，而且設置其clear爲both,這個方法的原理是：

設置這個額外的空盒子左右不容許浮動元素，因此他會跑到浮動元素的下面，固然在浮動元素所有爲float:left時該盒子能夠設置爲clear:left,浮動元素所有爲float:right時該盒子能夠設置爲clear:right.爲了保險和方便起見仍是clear:both比較好,

注意不要設置其高度，不然他會撐開父盒子致使父盒子高度變大。

2.使用after僞元素，對父級元素添加類名，並設置其after僞元素

.clearfix:after{
            content: '';
            display: block;
            clear: both;
        }
        .clearfix{
            *zoom:1;　　/*兼容ie6.ie7*/
        }

原理和額外標籤相似。

3.雙僞元素法，對父級元素添加類名，並設置其after僞元素

 .clearfix:before,.clearfix:after{
            content: '';
            display:table;
            clear: both;
        }
        .clearfix{
            *zoom:1;
        }

原理和額外標籤相似。

4.overflow方法：給父級元素添加overflow：hidden、auto或者scroll

這種方法可能會出現滾動條

5.給父級元素設置高度：簡單暴力可是實用性不強，高度固定適用範圍不大