float (浮動) 屬性可達成文字繞著一個圖案顯現，可能的值為：left、right、和 none。
float:left; 使圖案浮動於左邊。
float:right; 使圖案浮動於右邊。
float:none; 使圖案不浮動。
clear (清除) 屬性可用來抵銷 float 屬性的作用。可能的值為：
left：消除左邊的浮動。
right：消除右邊的浮動。
both：消除左邊及右邊的浮動。
none：不消除任何一邊的浮動。
範例如下：
<!DOCTYPE html>
<html>
<head>
<title>CSS float&&clear</title>
<meta charset="utf-8">
<style type="text/css">
#rightfloat {
float:right;
}
#clearright {
clear:right;
}
</style>
</head>
<body>
<span id="rightfloat"><img src="background.jpg"></span>這個例子
<span id="clearright">展現出 clear:right 能夠抵銷 float 屬性的值。</span>
</body>
</html>
成果如下圖：
iThome鐵人賽
看影片追技術