清除浮动

结合多种清除浮动的方式，总结起来即只要触发BFC即可清除浮动，可以触发BFC的css样式包括：

• display: inline-block
• display: table-cell
• display: table-caption
• float
• overflow: hidden或auto

结合after和before~给出一种清除浮动的方式：

.clearfix:before,
.clearfix:after {
  content: ' ';
  display: table;
}
.clearfix:after {
  clear: both;
}

给before也加上content并且设置display: table是为了防止设置了清除浮动的元素其margin-top和上一个元素的margin-bottom重合

要不要给before加这个设置应视具体情况而定