.clearfix:after {
visibility:hidden;
display:block;
font-size:0;
content:' ';
clear:both;
height:0;
}
.clearfix {zoom:1;} /兼容ie6
--------------------------------------------------------------------------
:after 伪元素在元素之后添加内容。 在元素内容的最后面插入生成内容。
:before 伪元素在元素之前添加内容。 在元素内容的最前面插入生成内容。
PS:前后可插入任何内容。
--------------------------------------------------------------------------
<div class="clearfix">
<ul class="clearfix">
<li >1</li>
<li >2</li>
<li >3</li>
</ul>
</div>