高度塌陷是指当浮动元素的父元素没有设定高度时，由于子元素浮动，父元素无法自动扩展高度。解决方法包括给父元素添加`overflow:hidden`来触发BFC，或者在浮动元素下方添加一个带有`clear:both`和`height:0`的空div。此外，还可以使用CSS伪元素`:after`结合`clear:both`和`display:block`进行清除浮动。
1.什么是高度塌陷
浮动元素父元素高度自适应，即当子元素有浮动并且父元素没有高度的情况下父元素会出现高度塌陷。
2.如何解决
- 给父元素添加声明 overflow: hidden (触发一个BFC)
- 在浮动元素下方添加空div,并给该元素添加声明：
div{clear:both; height:0; overflow:hidden;}
- 万能清除浮动法
选择符:after{content:“";clear:both;display:block;height:0;overflow:hidden;visibility:hidden;}
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
