清理浮动一般有两种思路
一.利用 clear属性，清除浮动
二.使父容器形成BFC
一：内墙法，用clear:both这个属性的意思，我要排在浮动元素后面。
.clearfix:after{
content:".";
display:block;
height:0;
clear:both;
visibility:hidden;
}
//适配ie
.clearfix{zoom:1}
二：BFC
1.BFC区域有如下条件：
- 1.内部的Box会在垂直方向，一个接一个地放置。
Box垂直方向的距离由margin决定。属于同一个BFC的两个相邻Box的margin会发生重叠
2.BFC的区域不会与float box重叠。
BFC就是页面上的一个隔离的独立容器，容器里面的子元素不会影响到外面的元素。反之也如此。
3.计算BFC的高度时，浮动元素也参与计算
每个元素的margin box的左边， 与包含块border box的左边相接触(对于从左往右的格式化，否则相反)。即使存在浮动也是如此。
2.生成BFC盒子的条件 ：
float为 left|right
overflow为 hidden|auto|scroll
display为 table-cell|table-caption|inline-block
position为 absolute|fixed
.clearfix::before,
.clearfix::after {
content: "";
display: table;
}
.clearfix::after {
clear: both;
}
.ckearfix{*zoom:1;}
单独为 *zom:1解释一下，因为IE67有问题，适配有BUG要触发hsLayout，要触发hasLayout，所以用*zom:1;
个人博客： www.liangtongzhuo.com
