高度塌陷

1.概念
　　父元素在文檔流中高度預設是被子元素撐開的，當子元素脫離文檔流以後，將無法撐起父元素的高度，也就會導致父元素的高度塌陷
　　父元素的高度一旦塌陷所有元素的位置將會上移，導致整個頁面的佈局混亂

2.方法一

在塌陷的父元素的最後添加一個空白的div，然後對該div進行清除浮動

<div class="box1">
	<div class="box2"></div>
	<div style="clear:both"></div>
</div>

使用這種方式會在頁面中添加多餘的結構

3.方法二

使用after偽類，向父元素後添加一個塊元素，並對其清除浮動

.clearfix:after{
	content:"";
	display:block;
	clear:both;
}

.clearfix{
	zoom:1;
}

該種方式的原理和方法二原理一樣，但是不用向頁面中添加對於的結構

其中zoom:1還是只相容ie6，:after是css中的偽類，ie6以及以下版本都不相容。此方法可以說是綜合起來最好的方法了，不會影響任何其他樣式，通用性強，覆蓋面廣。