最近在看《CSS Mastery》這本書，里面有用overflow：hidden來清理浮動的方法。但是一直想不明白為什么能夠實現清除浮動，查閱了網絡上的解釋，下面來總結一下。
一、首先來想想
我們大家理解的overflow:hidden是超出該元素的部分進行隱藏。這個時候就需要明確一點，該元素的高度是怎么定義的。當一個div中的兩個元素浮動之后，此時div的高度就會塌陷，此時div的高度為0。那是不是意味着就要將浮動元素隱藏起來，如果是真的隱藏就是反布局常識的。所以這中間肯定有我們現在還不知道的機制。
二、不了解的機制-BFC
定義：BFC（Block Formatting Context）全稱是塊級格式化上下文，用於對塊級元素排版，默認情況下只有根元素（body）一個塊級上下文，但是如果一個塊級元素設置了float:left,overflow:hidden或position:absolute樣式，就會為這個塊級元素生產一個獨立的塊級上下文，使這個塊級元素內部的排版完全獨立。
作用：獨立的塊級上下文可以包裹浮動流，全部浮動子元素也不會引起容器高度塌陷，就是說包含塊會把浮動元素的高度也計算在內，所以就不用清除浮動來撐起包含塊的高度。
三、總結清除浮動的方法
我經常用到的清除浮動的方法有
1、添加額外標簽設置clearfix類為clear:both;
原理是這個空的div能讓父級獲取到高度，是因為設置之后這個div的左右都不能有浮動元素，所以這個空的div元素會向下移動，直到換行，而為了讓這個div能夠換行，父元素至少要包含浮動元素的高度才能提高足夠的空間，這樣實現清除浮動的影響。
2、設置父元素為浮動元素
3、設置position:absolute
我不常用的清除浮動的方法有
1、父級div定義height
3、overflow:hidden
2、父級div定義偽類:after和zoom;
這個方法的原理還不理解，歡迎大神解答。
四、清除浮動的影響方法分類
參考張鑫旭老師的說法，清除浮動的說法是不准確的。應該是為清除浮動的影響。我也覺得張老師的說法是正確的，因為float:none才叫清除浮動。張老師還說到了包裹的這個概念，根據這個概念將清除浮動的影響的方法分為兩大類。
一類是clear:both/left/right，這就不用說了。
另一類是：包裹清除，因為他發現浮動、絕對定位、inline-block、overflow都有自適應元素寬度的特性，就想到了用包裹來形容。