眾所周知，css中的定位機制分為，文件流，浮動和絕對定位。(今天不談絕對定位)，如果對元素沒有進行任何定位處理的話，元素應該處於文件流中，當我們對元素進行了浮動(float)時，我們的元素就會脫離文件流，像乙隻小船一樣漂流在文件之上。首先來看一下浮動會帶來哪些result.
第一：先看**
效果：
result ：1、父盒子的margin受到影響，無法實現左右居中，
2、我沒有給父盒子設定高度，浮動後父盒子的高度沒有被撐開，中撐開的高度是padding帶來的效果。
接下來我們再進行乙個有趣的操作，新增乙個div塊類名為d，並且我們不對他進行浮動，這時候你會發現：
div：d竟然跑到了div:a的下面。那麼此時我們就需要進行清除浮動了。
第二：清除浮動的方法
方法1、 在浮動元素的最後面新增乙個新元素，應用clear:both.（clear:left是清除左浮動，clear:right是清除有浮動。為了方便，一般我們都是使用clear:both）
**如下：
效果：
注：也可以直接在div:d上新增clear:both，效果一樣。
方法2、浮動元素的父元素使用overflow：auto；
注意：使用overflow屬性來清除浮動有一點需要注意，overflow屬性共有三個屬性值：hidden,auto,visible。我們可以使用hiddent和auto值來清除浮動，但切記不能使用visible值，如果使用這個值將無法達到清除浮動效果，其他兩個值都可以，其據說在於乙個對seo比較友好，另乙個hidden對seo不是太友好。
方法3、使用偽類：after，：before，同樣是對浮動元素的父元素新增，此方法也是我最喜歡的方法
其中clear:both;指清除所有浮動；content: '.'; display:block;對於ff/chrome/opera/ie8不能缺少。
為什麼要清除浮動
box box content 解決方法 1 overflow1 方法1 overflow hidden auto 加zoom 1 overflow屬性的hidden auto 對ff ie7 opera起作用,而zoom對ie5.5及以上起作用 子盒子浮動，父盒子不浮動，且父盒子沒有設寬高，那麼 ...
為什麼要清除浮動
父元素的高度是由子元素撐開的，且子元素設定了浮動，父元素沒有設定浮動，子元素脫離了標準的文件流，那麼父元素的高度會將其忽略，如果不清除浮動，父元素會出現高度不夠，那樣如果設定border或者background都得不到正確的解析。清除浮動的方法 1 給浮動元素父級加overflow auto 在ie...
為什麼要清除浮動以及清除浮動的幾種方法
答 因為當父盒子高度為0時，子盒子不佔位置，子盒子不會撐開父盒子，所以下面的標準流盒子，會跑到父盒子中的子盒子下面。在浮動盒子的後面新增乙個空盒子，對該空盒子新增css樣式 clear both 對浮動的盒子父級新增該屬性 overflow hidden 單偽元素標籤法，誰出問題就給誰加乙個clea...