清除浮動BFC、div隨子元素高度增加而改變

因爲高度塌陷所以需要清除浮動：元素脫離了文檔流

滿足下列條件之一就可觸發BFC

　　【1】根元素，即HTML元素 
　　【2】float的值不爲none 
　　【3】overflow的值不爲visible 
　　【4】display的值爲inline-block、table-cell、table-caption 
　　【5】position的值爲absolute或fixed

/*解決：清除浮動*/
/*父級加:*/
1、給父級直接加高度(拓展性不好，不確定父級高度的時候不能使用)
2、overflow:hidden;

3、.clearfloat:after{
    content:"";
	display:block;
	clear:both;
	visibility:hidden;
	height:0;
} 
/*簡單的*/
.clearfloat:after {
    content: '';
    display: block;
    clear: both;
}
.clearfloat{zoom:1} /*針對IE8以下做的兼容*/

/*更好的一種:清除浮動、防止瀏覽器頂部的空白奔潰*/
/*創建一個匿名的表格單元*/
.clearfloat:after,
.clearfloat:before{
	content:"";
	display:table;
} 
.clearfloat:after{
	clear:both;
}