我們前面說過，浮動本質是用來做一些文字混排效果的，但是被我們拿來做布局用，則會有很多的問題出現， 但是，你不能說浮動不好 。
由於浮動元素不再占用原文件流的位置，所以它會對後面的元素排版產生影響，為了解決這些問題，此時就需要在該元素中清除浮動。
準確地說，並不是清除浮動，而是清除浮動後造成的影響
如果浮動一開始就是乙個美麗的錯誤，那麼請用正確的方法挽救它。
清除浮動主要為了解決父級元素因為子級浮動引起內部高度為0 的問題。
其實本質叫做閉合浮動更好一些, 記住，清除浮動就是把浮動的盒子圈到裡面，讓父盒子閉合出口和入口不讓他們出來影響其他元素。如果清除了浮動， 父親去自動檢測孩子的高度 以最高的為準。
在css中，clear屬性用於清除浮動，其基本語法格式如下：
選擇器clear 清除描述left
不允許左側有浮動元素（清除左側浮動的影響）
right
不允許右側有浮動元素（清除右側浮動的影響）
both
同時清除左右兩側浮動的影響
是w3c推薦的做法是通過在浮動元素末尾新增乙個空的標籤例如
，或則其他標籤br等亦可。
缺點： 新增許多無意義的標籤，結構化較差。
練習：
可以通過觸發bfc的方式，可以實現清除浮動效果。
可以給父級新增： overflow為 hidden|auto|scroll 都可以實現。缺點： 內容增多時候容易造成不會自動換行導致內容被隱藏掉，無法顯示需要溢位的元素
:after 方式為空元素的公升級版，好處是不用單獨加標籤了
使用方法：
.clearfix:after
.clearfix /* ie6、7 專有 */
缺點： 由於ie6-7不支援:after，使用 zoom:1觸發 haslayout。
注意： content:"" 盡量不帶點
練習：
使用方法：
.clearfix:before,.clearfix:after
.clearfix:after
.clearfix
缺點： 由於ie6-7不支援:after，使用 zoom:1觸發 haslayout。
前端CSS怎麼清除浮動？
前端怎麼清除浮動？方法一 使用帶clear屬性的空元素 在浮動元素後使用乙個空元素如 並在css中賦予.clear屬性即可清理浮動。亦可使用 或來進行清理。方法二 使用css的overflow屬性 給浮動元素的容器新增overflow hidden 或overflow auto 可以清除浮動，另外在...
css浮動清除筆記
1.在文件流中內容的高度可以撐起父元素的高度 2.在浮動流中浮動的元素是不可以撐起文件流父元素的高度 如果父元素也是浮動的就可以 可以看到將p元素設定浮動之後，並沒有撐起父元素div 我是文字1 我是文字1 我是文字1 我是文字2 我是文字2 我是文字2 根據浮動排列的規則和浮動不能撐起父元素的高度...
css學習筆記之浮動清除
說到浮動，不得不說一下bfc block formatting context 翻譯為 塊級格式化上下文 關於bfc的原理，我參考了此篇文章，bfc參考資料 大家有需要可以去看看。清除浮動 子層 底部 這種方法雖直接讓底部的div擠到下方，並沒有真正的清除浮動，但可以達到清除浮動的效果。清除浮動 子...