没有高度和宽度的母元素高崩溃的解决方案

当未设置父元素时,不设置高度和宽度,然后将其高度折叠为零。前提是它只包含浮动元素。解决高坍塌问题的方法非常简单。它可以浮动父元素,清除方法等。





如果父元素只包含浮动元素,与父元素没有设置高度和宽度,其高度会崩溃到零,即所谓的高度;倒塌;如果父元素包含背景或边框,然后溢出元素不是父元素的一部分,解;高崩溃;问题很简单:

1。浮动的父元素

如果父元素是浮动的,父元素的高度将展开,直到它包含其中的浮动元素,虽然这个方法非常奇怪,但非常有效。如果选择了这个方法,一定要添加清楚的元素,即元素的下一个元素,以确保浮动元素落在父元素的下方。

2。使用溢出:隐藏,缩放:1

复制代码代码如下所示:
{
溢出:隐藏;
缩放:1;
}

隐藏属性在CSS中也是一个奇怪的特性。它将强制父元素展开以包含浮动元素。变焦:1只触发IE6的haslayout模式,它不会影响其他浏览器。

三.使用简易扫气法;

复制代码代码如下所示:
Clearfix {。
缩放:1;
}
{ clearfix:后。
内容;
显示块;
身高:0;
字体大小:0;
清楚:两者;
溢出:隐藏;
}

变焦:1仍然是只兼容IE6,之后是CSS伪类,和IE6及以下版本是不兼容的。这种方法可以说是最好的综合方法,而不会影响任何其他方式。它用途广泛,涉及面广。