利用div进行页面的布局1(float＆clear属性)

请看下面的代码：

 1 < html >
 2 < head >
 3 < script  language ="javascript" >
 4 </ script >
 5 < style  type ="text/css" >
 6 </ style >
 7 </ head >
 8 < body >
 9 < div  style ="position:absolute;top:100px;left:100px;width:300;height:300;background-color:#99FF00" >
10      < div  style ="float:left;width:100;height:100;background-color:red" ></ div >
11      < div  style ="clear:right;height:100;background-color:blue;" ></ div >
12 </ div >
13 </ body >
14 </ html >

 
float : none | left | right
 
参数：
 
none : 　对象不浮动
left : 　对象浮在左边
right : 　对象浮在右边
 
说明：
该属性的值指出了对象是否及如何浮动。
当该属性不等于none引起对象浮动时，对象将被视作块对象(block-level)，即display属性等于block。也就是说，浮动对象的display特性将被忽略。
对应的脚本特性为styleFloat。

clear : none | left | right | both
 
参数：
 
none : 　允许两边都可以有浮动对象
both : 　不允许有浮动对象
left : 　不允许左边有浮动对象
right : 　不允许右边有浮动对象
 
说明：
 
该属性的值指出了不允许有浮动对象的边。
对应的脚本特性为 clear。