第一种方式：
//IE浏览器
.clearfloat{
zoom:1
}
//其他浏览器
.clearfloat ; after{
display:bloak;
clear:both;
content:"";
visibility: hidden;
height:0
}
第二种方式：更优雅的
//IE浏览器
.clearfloat{
zoom:1
}
//其他浏览器
.clearfloat:after,.clearfloat:before{
content:"";
display:table
}
.clearfloat:after{
clear:both
}
备注：before是为了解决元素的顶部空白塌陷，上面的元素margin-bottom:10px,下面的 元素margin-top:10px;这俩个元素放在一起，俩者的距离为10px,俩个margin发生了叠加
第三种方式：
父类设置： overflow:hidden
第四种方式：(最好不要用)
也给父类设置float
第五种方式：
创建一个空白的<div><div>
设置class为 clear:both