說起來呢，基本上只要你給容器div加了float的屬性，就需要清除浮動來使頁面顯示正常，那麼，到底有什麼方法可以讓浮動輕鬆清除呢？
可以用display：flex;替代，但是它對ie8，9支援不是很好，所以不怎麼這麼用。
1.在容器div的裡面結束標記之前寫如下這樣的div這段**：
雖然通俗易懂，容易掌握，但是在頁面中加入了乙個無意義的空標籤，違背了結構和表現分離的web標準的精髓，如果頁面空標籤多的話，對於後期的維護會造成一定的困難。一般來說，現在已經不採用這種方法。
2.在浮動容器div的css樣式中加入overflow屬性。
3.將父元素也變成浮動元素，但是影響整個頁面的布局，不推薦使用。
4.使用:after偽元素，一般增加clearfix的class，大概寫法如下：
.clearfix:after.clearfix
除了clear:both;是為了清除浮動以外，其他的屬性就是為了隱藏這個元素，所以我們對它進行了改進一下：
.clearfix:after,.clearfix:before.clearfix:after
.clearfix
.clearfix:before，加上before，對清除浮動沒什麼作用，防止瀏覽器頂部空白崩潰，也就是說，margin-top和上乙個盒子的margin-bottom它們會發生乙個疊加，這麼做就是防止疊加，其實沒有這個需要，去掉before也沒啥問題。
原理和第一種方法差不多，就是用clear:both;
使用的原理基本上就是觸動bfc，
bfc：block formating contexts 塊級格式化上下文
比如下面這些就是：
float：left;
overflow：auto;
display：table-cell;
display:table-caption;
display:inline-block;
position:fixed;
position:absolute;
目前就是用最後的一種方式來進行清除浮動，畢竟優雅~~~
清除浮動的css寫法正確的是 CSS3清除浮動
志同道合的小夥伴跟我一起學習交流哦！1 清除浮動的本質 清除浮動主要為了解決父級元素因為子級浮動引起內部高度為0的問題。清除浮動的方法 其實本質叫做閉合浮動更好一些，記住，清除浮動就是把浮動的盒子圈到裡面，讓父盒子閉合出囗和入口不讓他們出來影響其他元素。在css中，clear屬性用於清除浮動，其基本...
CSS清除浮動 清除float浮動
css清除浮動方法集合 一般浮動是什麼情況呢？一般是乙個盒子裡使用了css float浮動屬性，導致父級物件盒子不能被撐開，這樣css float浮動就產生了。浮動產生樣式效果截圖 本來兩個黑色物件盒子是在紅色盒子內，因為對兩個黑色盒子使用了float浮動，所以兩個黑色盒子產生了浮動，導致紅色盒子不...
CSS清除浮動 清除float浮動
css清除浮動方法集合 一般浮動是什麼情況呢？一般是乙個盒子裡使用了css float浮動屬性，導致父級物件盒子不能被撐開，這樣css float浮動就產生了。浮動產生樣式效果截圖 本來兩個黑色物件盒子是在紅色盒子內，因為對兩個黑色盒子使用了float浮動，所以兩個黑色盒子產生了浮動，導致紅色盒子不...