手写一个clearfix

/* 手写一个clear fix */
.clearfix:after {
  content: "";
  display: block;
  clear: both;
}
/* 兼容 IE 低版本 */
.clearfix {
  *zoom: 1;
}

清除浮动本质上是要消除浮动元素带来的一些影响（例如高度塌陷）

手写一个 clearfix：给父元素添加 clearfix 类名，并在其 :after 伪元素添加 clear:both; 正常情况下不需要 display:block; 因为 div 默认是 block，但可能被其它样式选择器设置为其它的方式，如果inline，就导致这个作用无效了，所以需要加上 display:block; 同时给 .clearfix 设置 *zoom: 1; 属性以兼容低版本的 IE