解決辦法

1.在高度塌陷的父div裏面加一個div：

<div id="a">

<div id="a1">

</div> <div id="a2">

</div>

<div style="clear: both;"></div>//加一個標簽，清除浮動

</div>

優點：適合初學者，兼容性 強。
缺點：代碼不簡練，不利於優化。

2.overflow + zoom方法

#a{ background: red;

/*第二種方法*/

overflow: hidden;

zoom:1; }

優點：兼容性強。
缺點：對margin屬性會有影響，不能設負值，會被裁掉。負值絕對定位也不可以。

3.after + zoom方法（絕殺)

#a{ background: red; zoom:1; }

#a:after{ display: block;

content: ‘.‘;

clear:both;

line-height: 0;

visibility: hidden; }

優點：通用，兼容性強
缺點：不好記。

HTML--高度塌陷（css）幾種小技巧