說到浮動，不得不說一下bfc（block formatting context),翻譯為「塊級格式化上下文」。關於bfc的原理，我參考了此篇文章，bfc參考資料
，大家有需要可以去看看。
清除浮動-子層底部
這種方法雖直接讓底部的div擠到下方，並沒有真正的清除浮動，但可以達到清除浮動的效果。
清除浮動-子層
通過設定display為inline-block或者table或者table-cell或者
table-caption，可以清除浮動
但display：inline-block、display：table-cell和display：
table-caption都會使margin: 0 auto;失效，達不到想要的塊居中效果；display:table;不存在上述現象。
清除浮動-子層
2-4.使用:after
清除浮動-子層
此方法比較優雅。
a.為父div設定overflow:hidden或者overflow: auto；
清除浮動-子層
b.在父div裡加空div
清除浮動-子層
c.為父div設定position:fixed;absolute同樣可以清除浮動
清除浮動-子層
最終，清除浮動還是圍繞著觸發bfc的條件在變。
CSS 小結筆記之清除浮動
浮動是乙個非常好用的屬性，但是有時會出現一些問題，需要進行清除浮動。例如 在父盒子沒有給出高度的情況下，子盒子浮動不會將父盒子撐開來。清除浮動使用clear left right both一般使用clear both，具體方法如下 1 在浮動標籤後邊新增乙個額外的clear標籤例如 這樣做的方法 例...
css浮動清除筆記
1.在文件流中內容的高度可以撐起父元素的高度 2.在浮動流中浮動的元素是不可以撐起文件流父元素的高度 如果父元素也是浮動的就可以 可以看到將p元素設定浮動之後，並沒有撐起父元素div 我是文字1 我是文字1 我是文字1 我是文字2 我是文字2 我是文字2 根據浮動排列的規則和浮動不能撐起父元素的高度...
學習筆記 css中清除浮動
1.浮動使元素脫離文件流。2.浮動的元素可以設定寬高，在 css 中，任何元素都可以浮動。浮動元素會生成乙個塊級框，而不論它本身是何種元素。3.如果沒有給浮動元素指定高度，那麼它會以內容的高度為自己的高度，並且盡可能的窄。4.浮動的元素因為脫離了文件流，所以不能把父元素撐出高度。5.浮動框脫離了文件...