(101条消息) 如何清除浮动
如何清除浮动:
- 父元素中添加一个属性 overflow:hidden
- 添加额外标签,并在标签中使用clear:both
- 给浮动元素父级设置高度
- 使用伪元素(必须是块级元素上使用)
clearfix:after {
content: '';
height: 0;
display: block;
clear: both;
overflow: hidden;
visibility: hidden;
}
.clearfix {
zoom: 1;
}
- 使用双伪元素清除浮动
.clearfix:before,.clearfix:after {
content: "";
display: block;
clear: both;
}
.clearfix {
zoom: 1;
}
=> 推荐使用第4种方法使用伪元素,因为第1种方法子元素的内容超出会被隐藏掉,第二种增加许多不必要的标签,第3种只适合那种固定高度的布局,最后一种不够严谨。
赞 (0)