HTML中子div设置浮动后会导致父div无法自动撑开怎么办

　　介绍

这篇文章给大家分享的是有关的HTML中子div设置浮动后会导致父div无法自动撑开怎么办的内容。小编觉得挺实用的,因此分享给大家做个参考。一起跟随小编过来看看吧。

原因:内部的p因为浮动:左之后,就丢失了明确:两和显示:块的样式,所以外部的p不会被撑开。

以下是几种解决办法(假设p的父类为“容器”):

<李>

方法,使用伪类

容器::{后 　　显示:块; 　　高度:0; 　　内容:& # 39;& # 39;; 　　明确:; 　　} 　　容器{ 　　显示:inline-block;/*第一种撑开办法,底下会有部分被遮到,所以添加这行,就完美了*/} <李>

方法2,不撑开的原理是溢出不可见,所以给父p添加溢出:汽车;就行,即要用_height: 1%;

容器{ 　　溢出:汽车;/*让主要内容区随内容自动撑开*/overflow-y:隐藏;/*把出现的滚动条隐藏,但是底下会被遮到一点,不完美*/_height: 1%;/*对IE的攻击*/} <李>

方法,可以专门最后添加一个子p用来清除浮动:<代码> & lt; p类=癱lear"祝辞& lt;/p>
设置样式。<代码>明确{明确:;字体大小:0;高度:1%;}

<李>

方法,可以设置父p的高度(也就是手动撑开,不灵活);

<李>

方法5、直接给父p设置<代码>显示:inline-block; 这样也自动撑开

<李>

方法6,直接给子p设置<代码>显示:inline-block;> <李>

方法,从网上还发现了一种方法,给父p增加属性:<代码>显示:表;

<李>

方法,子p浮动我就套不住你吗?好的,我让父p也浮动:父p设置<代码>浮动:左;>

HTML中子div设置浮动后会导致父div无法自动撑开怎么办