清浮動

本文轉載於:猿2048網站清浮動

方法

　　對於標準瀏覽器來講，清浮動其實就兩種方法，一種是在浮動元素下面添加新元素設置clear屬性；另外一種是觸發包含塊的BFC，使其包含浮動元素。而對於IE7-瀏覽器，則用到其特有屬性haslayout

【1】clear屬性

　　[1]<div style="clear:both"></div>

　　<注意>並非很適用，若包含塊爲<ul>，則子元素只能爲<li>，則在<li>後面添加<div>元素不合適

　　[2]<br style="clear:both">

　　<注意>雖然clear屬性只應用於塊級元素，但在除IE7-之外的其餘瀏覽器均可以將clear屬性應用於<br>元素

　　[3]爲浮動元素的after僞元素設置clear屬性（推薦）

　　.clear:after{content:""; display: block; clear: both;}

　　<注意>IE7-瀏覽器不支持after僞元素

【2】BFC

　　[1]float: left/right

　　[2]position:absolute/fixed

　　[3]display:inline-block/table-cell/table-caption/flex

　　[4]overflow:hidden/scroll/auto