子元素使用float后使父元素有高度的方法

</pre><p style="font-family:'Microsoft Yahei'; font-size:14px; line-height:22.3999996185303px">一般我们会这样写HTML代码：</p><p style="font-family:'Microsoft Yahei'; font-size:14px; line-height:22.3999996185303px"><pre name="code" class="html"><div>
    <div style="float:left;">test</div>
</div>

这样往往使得父级DIV没有高度，一般我们可以通过以下几种方法使得父级DIV也有高度：

1、给父级DIV也加上float；

2、给父级DIV加上height；

3、在子级DIV后面加上<div style="clear:both;"></div>，即清除浮动。

上面的方法中，可能第三种用的多一点（至少我是这样的），昨天发现原来还有一个更简单的方法，就是给父元素加上overflow:hidden;属性，代码如下：

<div style="overflow:hidden;">
    <divstyle="float:left;">test</div>
</div>

转自：小虾虎鱼博客

原文链接：http://www.xiaoboy.com/detail/1341545045.html