1. 程式人生 > >子元素使用float後使父元素有高度的方法

子元素使用float後使父元素有高度的方法

一般我們會這樣寫HTML程式碼:
<div>
    <div style="float:left;">袁建龍測試</div>
</div>

這樣往往使得父級DIV沒有高度,一般我們可以通過以下幾種方法使得父級DIV也有高度:

1、給父級DIV也加上float;
2、給父級DIV加上height;
3、給父元素加上overflow:hidden;屬性
4、在子級DIV後面加上<div style="clear:both;"></div>,即清除浮動。
或者新增一個span標籤

<span class="clear"></span>
.clear
{display:block;overflow:hidden;clear:both;height:0;line-height:0;font-size:0}

上面的方法中,可能第四種用的多一點