手写一个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

posted @ 2019-08-19 11:52  Leophen  阅读(514)  评论(0)    收藏  举报