overflow ：hidden 和 clear：both 與 clearfix撐起高度坍塌的父元素應用

overflow ：hidden 和 clear：both防止父元素塌陷的應用

二者都可以應用於清除浮動，將包含有float元素的高度坍塌的父元素高度撐起來；

（1）overflow：hidden：

只要在父元素裏面設置：overflow ：hidden 即可：

原理:

因爲overflow屬性（除了應用visible），對於scroll hidden auto 都會對當中的 float ，position：absolute，inline-block等浮動元素塊級格式化，相當於塊元素，此時相比原來的浮動元素對於父元素高度坍塌問題就不存在了。

（2）both：clear

在父元素裏面設置一個與浮動元素同級的div子元素，然後設置

clear：both，

display: block;

visibility: none;
height: 1px；

原理：在float浮動元素下面存在的塊元素，兩邊不能有浮動元素，自然撐開了父元素的高度

（3）

添加clearfix類

.clearfix：after

{

visible:hidden;

display:block;

content: ". ";

clear:both;

font-size:0;

height:0;

}

//爲ie6準備。

.clearfix{zoom: 1;}