在CSS中，清除浮動都是在設置左浮動或者右浮動之後的元素內設置。
語法：
clear:取值;
說明：
clear屬性取值如下：
使用clear屬性清除浮動，我們比較少使用“clear:left;”或者“clear:right;”來判斷是清除左浮動，還是清除右浮動。我們往往直截了當地使用“clear:both;”來把所有浮動清除，還省事。也就是說，我們在這一節只要學會“clear:both;”這一個屬性就足夠啦。
舉例：
在線測試
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>CSS清除浮動</title>
<style type="text/css">
/*定義父元素樣式*/
#father
{
width:400px;
background-color:#0C6A9D;
border:1px solid silver;
}
/*定義子元素樣式*/
#father div
{
padding:10px;
margin:15px;
border:2px dashed red;
background-color:#FCD568;
}
/*定義文本樣式*/
#father p
{
margin:15px;
border:2px dashed red;
background-color:#FCD568;
}
#son1
{
/*這裡設置son1的浮動方式*/
float:left;
}
#son2
{
/*這裡設置son2的浮動方式*/
float:left;
}
#son3
{
/*這裡設置son3的浮動方式*/
float:right;
}
</style>
</head>
<body>
<div id="father">
<div id="son1">box1</div>
<div id="son2">box2</div>
<div id="son3">box3</div>
<p>這裡是浮動框外圍的文字，這裡是浮動框外圍的文字，這裡是浮動框外圍的文字，這裡是浮動框外圍的文字，這裡是浮動框外圍的文字，這裡是浮動框外圍的文字，</p>
</div>
</body>
</html>
在浏覽器預覽效果如下：
我們添加如下CSS樣式：
p{clear:both;}
這個時候在浏覽器預覽效果如下：
分析：
由於p元素清除了浮動，所以p元素的前一個元素產生的浮動就不會對後續元素產生影響，因此p元素的文本不會環繞在浮動元素的周圍。
除了使用clear屬性來清除浮動，還可以采用“overflow:hidden;”來清除浮動，在這裡大家只需要了解一下即可。在“CSS進階教程”，我們會詳細講解清除浮動都有哪些方法。
對於CSS浮動、CSS定位這些，你必須要通過實踐才能真正掌握（ 學習網會不斷改善，給你提供實踐題目）。實踐再回來看定義，就會很清楚了。