清除浮動是一件功德無量的事情23333 這裡記錄一下清除浮動的多種方式
*首先要明確的是，為什麼要清除浮動？1 給父級盒子定義高度a 影響其他元素定位
父盒子高度為0，子盒子全部浮動、定位，子盒子不會撐開父盒子，下面的元素會到子盒子的下面
b 背景或顏色不能正常顯示
由於浮動產生，如果對父級設定了css背景顏色或css背景，而父級不能被撐開，所以導致css背景不能顯示。
c margin padding設定受到影響
由於浮動導致父子盒子之間設定的padding margin不能正常表達，特別是上下的padding margin。
原理：父級div手動定義高度，就決絕了父盒子無法自動獲取到高度的問題，簡單有效**少
缺點：只適合高度固定的布局。
2 結尾處加上空div標籤 clear:both
原理：在浮動元素的後面加上空div元素，利用css提供的clear:both清除浮動，讓父盒子自動獲取高度。
缺點：如果頁面浮動較多，就要寫n個空標籤，會擾亂**。
3 **最佳拍檔** 使用偽類 父盒子:after 和 zoom
1.clearflo:after910
.clearflo
原理：ie8+支援，:after原理和方法2有點類似，zoom是ie專有屬性，可以解決6/7浮動問題，所以這是乙個比較好的解決辦法，推薦使用公共雷鳴，以減少css**
4 父盒子定義overflow:hidden
缺點：超出盒子部分會被隱藏，不推薦使用。
5 雙偽元素法
.clearfix:before, .clearfix:after.clearfix:after
.clearfix
原理：通過:after偽類在浮動元素後面加上display:table的不可見內容塊，並給它設定clear:both來清除浮動。
總結：第二種方法：簡單，瀏覽器支援好，但如果頁面浮動布局多，就要增加很多空div，讓人感覺很麻煩，不推薦使用，可以了解。
第三種方法：瀏覽器支援好,建議使用。
第五種方法：瀏覽器支援好,建議使用。
css清除浮動的種方式
我們在使用float浮動進行布局的時候知道一般需要給浮動的塊元素加上乙個父級元素，這樣元素浮動時才可以在父元素內部按照我們需要的方式進行布局，但是有乙個問題是如果父元素沒有給定高度的話當內部元素進行浮動之後父元素的高度就會是0，這是因為浮動的元素是處於標準流之外的。若是在一開始給定父元素乙個高度的話...
CSS 清除浮動的N種方式
清除浮動主要是為了解決，父元素因為子級元素浮動引起的內部高度為0的問題。舉個例子 class content class incont div div content incont 此時元素是這樣的 如果我們讓其中的子元素浮動，那麼就會變成下面這樣，我們會發現父元素的內容區的高度不見了 接下來我們要...
css 清除浮動的4種方式
浮動布局和定位布局為css中布局的常用的兩種布局方式，而且相容性會比較好。隨著flex的流行，以後會是主流，新的東西好用，相容不太好。ie10以下不相容flex布局。float布局會脫離文件流，對頁面的布局造成影響，比如造成父級的高度坍塌等問題。清除浮動後，便不會影響文件流。下面介紹一下現在清除浮動...