在div+css布局時，為了實現多種布局，會用到浮動。但是不清除浮動也會產生一些問題。
1、設定浮動會被塊級兄弟元素覆蓋
我設定了浮動但是沒有背景色
我沒有設定浮動，但是有背景色
body
#div1
#div_blank
#div_blue
我是塊元素，設定了浮動
我是span，沒有設定浮動
body
#p_id
#s_id
#s_span
一、clear:both利用空div，清除浮動。
處理方法簡單，相容性好。但是多了很多空的div，不利於後期維護。
二、父元素加overflow: hidden
處理方法簡單。但是有侷限，父元素必須能夠包含子元素。
三、:after偽元素
瀏覽器相容好。比較難理解，拿來主義直接用。**如下
#s1_div
#s2_div
.clearfix
.clearfix::after
:after偽元素
我是灰色，設定了左浮動
兄弟，我是黃色，不設定浮動
css清除浮動的幾種方法 清除浮動的方法有哪些？
為什麼使用浮動？浮動是一種常見的布局方式，當兩個或者多個塊級元素 塊級元素的特點是在文件中獨佔一行 需要並列為一行的時候，我們就需要加浮動 擴充套件知識，使塊級元素並列在一行的方式有很多種，比如使用display inline block,但是display inline block轉換出來的元素，...
css清除浮動的幾種方法
我一直以為產生浮動要我們給元素設定float，例如這裡提到的 今天我發現如果父盒子高度不定，子元素沒有設定浮動，如果父盒子高度變為0，那麼裡面的子元素會浮動，效果 黃色盒子上移了，很明顯child產生了浮動，效果等同於父盒子高度不定，子元素設定浮動，那麼父盒子高度會變成0，也就是高度坍塌。那麼如何解...
css清除浮動的幾種方法
當對某個標籤使用浮動的時候，該塊內容就會脫離文件流，其父元素便不再包裹該標籤內容，父元素的高度會變成0，出現高度塌陷的問題。這個時候就要清楚浮動。今天就來介紹一下css清除浮動的幾種方法。1.在文件最後麵新加乙個空的div,如下 style clear both div 但是如果使用這種方法，新增了...