ok， 下面举例说明下clear属性到底给float（clear常常和float结合使用）带来哪些影响：
html片段一：
代码如下:
#parentdiv
{
background: #00ff00;
}
.ret
{
width: 100px;
height: 200px;
background: #0000ff;
}
.fl
{
float: left;
}
.fr
{
float: right;
}
<div id=parentdiv>
<div id=“son1” class=fl ret>
<h2>left</h2>
</div>
<div id=”son2 class=fr ret >
<h2>right</h2>
</div>
</div>
效果：由于float导致两个子div(#son1, #son2)不占文档流，所以虽然两个子div的高为200px，但是父div#parentdiv的高度是0px。
问题：有时候我们需要父div的高度正好容纳下所有的子div。在这种情况下我们可以使用clear属性了。
html片段二：在html片段一的基础上添加css class：clear，给父div添加个子div（#son3）
代码如下:
#parentdiv
{
background: #00ff00;
}
.ret
{
width: 100px;
height: 200px;
background: #0000ff;
}
.fl
{
float: left;
}
.fr
{
float: right;
}
.clear
{
clear: both;
}
<div id=parentdiv>
<div id=“son1” class=fl ret>
<h2>left</h2>
</div>
<div id=”son2 class=fr ret >
<h2>right</h2>
</div>
<div id=son3 class=“clear”>
</div>
</div>
效果：这种情况下父div的高度是200px（和子div中最高的高度一样）。
分析：
子div（#son3）使用了clear属性，这样其上外边框在float元素（#son1，#son2）下外边框的下面，因为子div#son3要占文档流，所以父div不得不增加高度来容纳子div#son3，这样也就达到了预期效果。
