首页 > 其他 > 详细

2020年如何清除浮动?还在使用老的方式?clearfix?

时间:2020-04-06 19:55:16      阅读:81      评论:0      收藏:0      [点我收藏+]

将 group 类添加到任何需要清除浮动的父级元素即可,这行代码兼容 IE8 及以上,目前国内不少大网站也在采取这种做法。

.group:after {
  content: "";
  display: table;
  clear: both;
}

提示: 现在2020年,除了IE8需要兼容以外,很少项目会去兼容 IE6 和 IE7了, 而上面这行代码兼容IE8及以上,所以是可行的。

如果你需要兼容 IE7 或者 IE6,可以使用下面的版本:

.group:before,
.group:after {
  content: "";
  display: table;
} 
.group:after {
  clear: both;
}
.group {
  zoom: 1; /* 这行是为了 IE 6/7 (触发 hasLayout) */
}

来自css tricks这个网站的文章:https://css-tricks.com/snippets/css/clear-fix/
这个网站对于css相关的文章有很多,也很生动并且易懂,推荐可以去看看
还有这个查询兼容的网站也非常的好用:https://www.caniuse.com/

2020年如何清除浮动?还在使用老的方式?clearfix?

原文:https://www.cnblogs.com/xiaolantian/p/12643591.html

(1)
(1)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!