本文介绍了CSS中清除浮动的方法，包括父级触发BFC的原理和使用伪元素实现的clearfix技巧。BFC（块格式化上下文）是理解浮动元素影响的关键。通过设置clearfix类，可以在不增加额外HTML元素的情况下避免浮动元素导致的父级高度塌陷问题。此外，还提及了hasLayout概念，它是浏览器布局机制的一部分。
CSS 清除浮动
1、 父级触发 BFC (具体方法，及原理)
2、 建议使用：子集 clear:both; （清除浮动带来的脱离文档流影响）
[1] 在浮动元素之后，与浮动元素呈并列关系的位置添加一个空div,并在空div上添加属性clear:both;——代码冗余；
[2] 推荐方法：伪元素替代空div ，给浮动元素的父级盒加类名clearfix——不会在结构上产生冗余代码，可以重复使用；
.clearfix { *zoom:1; }
.clearfix:after {
content:"";
display: block;
clear:both;
}
3、父元素设置高度
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
