浮动会破坏父元素高度,导致父元素的高度塌陷。在使用中应当适度使用。
在使用了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)
新闻热点
疑难解答