利用float使得div可以在父容器中左右浮动,从而脱离文档流。使用完后,要利用clear:both清除浮动,使得后续元素仍按文档流布局.
![](https://images.cnblogs.com/OutliningIndicators/ContractedBlock.gif)
1 <style type="text/css"> 2 div{ 3 backgroud-color:green; 4 width:600px; 5 height:400px; 6 7 } 8 #s{ 9 backgroud-color:yellow; 10 width:300px; 11 height:200px; 12 } 13 #a{ 14 backgroud-color:pink; 15 width:300px; 16 height:200px; 17 18 } 19 </style> 20 </head> 21 22 <body> 23 <div id="s"></div> 24 <div id="a"></div> 25 <div style="clear:both"><div> 26 </body> 27