语法：
float : none | left |right
参数：
none : 对象不浮动
left : 对象浮在左边
right : 对象浮在右边
说明：
该属性的值指出了对象是否及如何浮动。请参阅clear属性。
当该属性不等于none引起对象浮动时，对象将被视作块对象(block-level)，即display属性等于block。也就是说，浮动对象的display特性将被忽略。
对应的脚本特性为styleFloat。请参阅我编写的其他书目。
语法：
clear : none | left |right | both
参数：
none : 允许两边都可以有浮动对象
both : 不允许有浮动对象
left : 不允许左边有浮动对象
right : 不允许右边有浮动对象
说明：
该属性的值指出了不允许有浮动对象的边。请参阅float属性。
对应的脚本特性为clear。请参阅我编写的其他书目。
.html代码如下：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>流式布局</title>
<link rel="stylesheet" type="text/css" href="css/style.css"/>
</head>
<body>
<div id="first">第一个div</div>
<div id="second">第二个div</div>
<div id="third">第三个div</div>
</body>
</html>
.css代码如下：
#first{
width:200px;
height:100px;
background:#ab0;
float:left;
}
#second{
width:200px;
height:100px;
background:#fba;
clear:left;
}
#third{
width:200px;
height:100px;
background:#aca;
float:left;
}效果如下：
常用布局方法应为：
#first{
<span style="white-space:pre"> </span>width:200px;
<span style="white-space:pre"> </span>height:100px;
<span style="white-space:pre"> </span>background:#ab0;
<span style="white-space:pre"> </span>float:left;
}
#second{
<span style="white-space:pre"> </span>width:200px;
<span style="white-space:pre"> </span>height:100px;
<span style="white-space:pre"> </span>background:#fba;
float:right;
<span style="white-space:pre"> </span>
}
#third{
<span style="white-space:pre"> </span>width:200px;
<span style="white-space:pre"> </span>height:100px;
<span style="white-space:pre"> </span>background:#aca;
clear:both;
}