浮動會破壞父元素高度,導致父元素的高度塌陷。在使用中應當適度使用。
在使用了float屬性的元素后增加空div,給空div clear:both的屬性。防止后面的元素向上浮動。
<div style="height : 0px; clear : both "> </div>利用CSS偽類,在其后追加clear:both的元素
.clearfix:after{ content:"."; overflow:hidden; display:block; height:0; clear:both;}IE6/IE7:
.clearfix:after{ *zoom:1; }BFC/haslayout haslayout可能在IE6/IE7上呈現出混亂的布局。 通常聲明: float:left/rightposition:absoluteoverflow:hidden/scroll(IE7+) 使用時會觸發瀏覽器的滾動條display:inline-block/table-cell(IE8+) *zoom:1(IE6/IE7)單側固定
width+float padding-left/margin-left
自適應尺寸
float display:table-cell(IE8+) display:inline-block(IE7)
新聞熱點
疑難解答