解決方法有4種類:
1.在使用浮動(dòng)的元素后面加一個(gè)div，屬性設(shè)置為style="clear: both" 馏锡，但增加了額外的html代碼。
2.在使用浮動(dòng)元素的父級(jí)容器加屬性overflow:hidden割择，這種方法在你添加下拉選項(xiàng)等操作時(shí)會(huì)將下拉的選項(xiàng)隱藏掉眷篇，這種場(chǎng)合下不適用。
3.父元素設(shè)置display: table荔泳，改變了盒模型的屬性蕉饼，會(huì)出現(xiàn)其他問題。
4玛歌、給父級(jí)容器加一個(gè)class="clearfix"昧港，完美解決：
.clearfix:after {
? ? display:block;
? ? content:"clear";
? ? clear:both;
? ? line-height:0;
? ? visibility:hidden;
}
(1)?display:block使生成的元素以塊級(jí)元素顯示,占滿剩余空間;
(2)?height:0避免生成內(nèi)容破壞原有布局的高度。
(3)?visibility:hidden使生成的內(nèi)容不可見支子，并允許可能被生成內(nèi)容蓋住的內(nèi)容可以進(jìn)行點(diǎn)擊和交互;
(4) 通過content:""生成內(nèi)容作為最后一個(gè)元素创肥，至于content里面是點(diǎn)還是其他都是可以的
(5)?zoom:1觸發(fā)IE hasLayout。
通過分析發(fā)現(xiàn)值朋，除了clear:both用來閉合浮動(dòng)的叹侄，其他代碼無非都是為了隱藏掉content生成的內(nèi)容，這也就是其他版本的閉合浮動(dòng)為什么會(huì)有font-size:0昨登，line-height：0
