在CSS的布局中，

clear

是一個(gè)非常常見的屬性，它的作用是控制元素在浮動(dòng)元素周圍的布局。

在使用浮動(dòng)元素時(shí)，可能會(huì)面臨一個(gè)問題，就是浮動(dòng)元素對(duì)周圍元素的影響。如果沒有正確設(shè)置，浮動(dòng)元素可能會(huì)覆蓋其他元素或者影響布局的整體效果。這時(shí)候，

clear

屬性就發(fā)揮作用了。

clear

屬性有四個(gè)可選值，分別是：

left, right, both, none

。默認(rèn)值為

none

。

如果設(shè)置了

clear:left

，則元素不能在其左側(cè)存在浮動(dòng)元素。同樣的，

clear:right

則表示元素不能在右側(cè)存在浮動(dòng)元素，

clear:both

則表示元素兩側(cè)都不允許存在浮動(dòng)元素。

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

通常，清除浮動(dòng)的常見方式是使用CSS偽元素（:after）。代碼如下：

.clearfix:after {
content:".";
display:block;
height:0;
clear:both;
visibility:hidden;
}
.clearfix {
zoom:1;
}

在上面的例子中，我們使用偽元素生成了一個(gè)隱藏的塊級(jí)元素，并利用它的清除浮動(dòng)的特性來(lái)解決布局中的問題。同時(shí)，為了兼容IE6/7，我們使用.zoom:1來(lái)引發(fā)IE的“hasLayout”屬性。

總之，在布局中使用浮動(dòng)元素時(shí)，清除浮動(dòng)是必不可少的。四種清除浮動(dòng)的方式可以根據(jù)實(shí)際情況選擇使用，清楚浮動(dòng)能夠保證布局的清晰和整潔。