DIV设置 float以后使下一个DIV另起一行的方法

在使用DIV + CSS制作网页的时候，经常会用到多个DIV并列排列，往往会使用float:left或float:right来实现，结果使用后问题也就出现了，当左边并列的多个DIV总宽度不足100%时，下边的DIV就很可能排在并列DIV的右边，和上一行的并列的DIV在同一行，这不是我们想要的结果。使用Clear属性就可以解决这个问题。

举例

<style type="text/css">
.LeftText { margin: 3px; float: left; height: 180px; width: 170px; border: 1px solid #B1D1CE; background-color: #F3F3F3; }
.FootText { height: 180px; }
.Clear { clear:both; }
</style>

<div class="LeftText">区块1</div>
<div class="LeftText">区块2</div>
<div class="Clear"></div>
<div class="FootText">区块3</div>

代码说明：

如果没有Clear这一层，“区块3”会紧接区块2并列在同一行。
加了Clear这一层后，会把上面的浮动DIV的影响清除，使其不至影响下面DIV的布局

clear 值	描述
left	在左侧不允许浮动元素。
right	在右侧不允许浮动元素。
both	在左右两侧均不允许浮动元素。
none	默认值。允许浮动元素出现在两侧。
inherit	规定应该从父元素继承 clear 属性的值。