html中高度塌陷

HTML中的高度塌陷是指当一个元素包含了另一个元素时，它的高度会塌陷为0，因为它的高度是由它的内容决定的，而不是由包含的元素决定的。这通常发生在父元素没有设置固定高度或没有设置浮动时。

解决方法：

1. 设置父元素的高度为固定值或使用min-height属性。

2. 给父元素设置浮动属性。

3. 给父元素添加overflow:hidden属性。

4. 使用CSS的伪元素:before或:after来清除浮动，例如：

.clearfix:before,
.clearfix:after {
    content: "";
    display: table;
}
.clearfix:after {
    clear: both;
}

这将在父元素的前面和后面添加一个空元素，从而清除浮动。

5. 使用Flexbox布局，这种布局可以自动解决高度塌陷的问题。

6. 使用CSS Grid布局，同样可以解决高度塌陷的问题。