div css 清除浮動

CSS中的浮動是一種常見的布局方式，其中元素被移動到其父元素的左側或右側。但是，在使用浮動布局時常常會遇到一些問題，其中最常見的問題是元素內部的高度不被正確計算。這時，我們需要使用CSS清除浮動來解決這個問題。

通常，我們使用一個空的塊級元素來清除浮動。比如說，如果我們把一個div浮動到左側，那么我們需要在其后面添加一個空的div來清除浮動，代碼如下：

<div class="float-left"></div>
<div class="clear"></div>

對應的樣式表代碼如下：

.float-left {
float: left;
}
.clear {
clear: both;
}

在上面的代碼中，我們為浮動元素添加了一個float:left樣式，然后使用一個空的div元素來清除浮動。我們使用.clear樣式的clear:both屬性來告訴瀏覽器清除浮動元素的左、右兩側的浮動效果，使得下一個元素可以正確地顯示。

除了使用空的元素來清除浮動之外，我們還可以使用一些其他的技巧來實現清除浮動。比如說，我們可以使用overflow屬性來清除浮動，代碼如下：

<div class="float-left"></div>
<div class="clearfix"></div>

對應的樣式表代碼如下：

.float-left {
float: left;
}
.clearfix {
overflow: auto;
}

在上面的代碼中，我們使用了clear：fix樣式類，并為其添加了overflow：auto屬性。這樣就可以讓父元素包含所有浮動的子元素，解決了高度不被正確計算的問題。