关键词：
将 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/
清除浮动-清除清除固定
Addclass"clear"toelementsthatcontainfloatedelementsandtheywillholdtheheightcorrectly/*CLEARFLOATS/*Addclass"clear"toelementsthatcontainfloatedelementsandtheywillholdtheheightcorrectly/*updated:01.10.2010*******************************************************/.clear:before,.clear:... 查看详情
清除浮动的方式
...消除父元素中子元素浮动对页面的影响。2.使用伪元素来清除浮动.clearfix:after{content:"";height:0;line-height:0;dispaly:block;/设置为块级元素/clear:both; /清除浮动/visibility:hidden;/将元素隐藏/}.clearfix{ 查看详情
清除浮动的几种方式和兼容性处理
...陷）知道浮动和为什么要清除浮动之后我们可以开始学习如何清除浮动了，这时候我们就需要用到清除浮动的属性clear, clear:left|ri 查看详情
清除浮动的几种方式和兼容性处理
...陷）知道浮动和为什么要清除浮动之后我们可以开始学习如何清除浮动了，这时候我们就需要用到清除浮动的属性clear, clear:left|ri 查看详情
那些年我们一起清除过的浮动float与clearfix(代码片段)
...也许很多人都有这样的疑问，浮动从何而来？我们为何要清除浮动？清除浮动的原理是什么？本文将一步一步地深入剖析其中的奥秘，让浮动使用起来更加得心应手。一、清除浮动还是闭合浮动（EnclosingfloatorCl 查看详情
浮动清除before&after
::before和::after属于伪元素，而:before和:after属于伪类（CSS3中为了区别伪元素和伪类为伪元素使用了双冒号）因此如果使用了display或者width等属性时使得显示脱离了原本元素后，建议按照标准双写。过于老的浏览器可... 查看详情
为何要清除浮动？如何清除？(代码片段)
原因：元素设置了float属性后，就会脱离文档流，当包含框的高度小于浮动框的时候，会出现高度塌陷。因此才需要清除浮动！表现如图：包括框container已经包不住float的图片了！清除浮动方法：1：给包含框添加after伪元素清除... 查看详情
css清除浮动
为什么要清除浮动浮动Floats是CSS中的一种布局方式，它的渲染位置在行框与包含块之间，这样就可以是行框内文字与浮动元素不重叠并且环绕它显示，在布局过程中也经常会使用它来达到左右并排布局的效果，但是，由于浮动特... 查看详情
清除伪元素
... 下面的元素会自动补位，所以这个时候要进行浮动的清除。关于清除浮动的方式: 方式一:使用overflow属性来清除浮动 .ovh{ overflow:hidden; } 先找到浮动盒子的父元素，再在父元素... 查看详情
css：清除浮动的三种方式及其原理(代码片段)
清除浮动的三种方式及其原理浮动元素的特性浮动元素脱离文档流，不占据空间。浮动元素碰到包含它的边框或者浮动元素的边框停留。浮动元素带来的问题因为浮动元素脱离文档流，所以对于其处于正常文档流中父元... 查看详情
css中清除浮动的两种方式
在CSS中，父元素中的子元素如果使用了float，会导致父元素塌陷，高度为0。 对于这种情况，常见的解决方式有两种。一、增加新的div，应用clear:both属性html:1<divclass="father">2<divclass="div1">1</div>3<divclass="div2"&... 查看详情
css清除浮动的五种方式
清除浮动是一件功德无量的事情23333这里记录一下清除浮动的多种方式 *首先要明确的是，为什么要清除浮动？A影响其他元素定位父盒子高度为0，子盒子全部浮动、定位，子盒子不会撑开父盒子，下面的元素会到子盒子的下... 查看详情
css的浮动以及如何清除浮动
css的浮动是经常会在实际中运用到，之前我对浮动的理解就是使用float，除此之外没有深入理解，后来发现对于浮动还是有必要深入理解一下。css浮动css的浮动是float属性，该属性没有继承性，默认值为none，该属性有四个Í... 查看详情
css的浮动以及如何清除浮动
CSS清除浮动的3种方法，参考：http://www.apiref.com/css-zh/experience/skill.htm#no9方法1：#testclear:both;#test为浮动元素的下一个兄弟元素方法2：#testdisplay:block;zoom:1;overflow:hidden;#test为浮动元素的父元素。zoom:1也可以替换为固定的width或height方... 查看详情
我的第一篇博客--css清除浮动
...一篇博客，请大家多多指教！今天我浅谈对网页编写css中清除浮动几种方法，众所周知在网页编写中，在遇到内容左右布局时，我们必须要使用浮动才能使元素左右排列，而这时当我们需在下面的网页中继续布局时，浮动就会给... 查看详情
清除浮动的几种方式
最近来了个小徒弟，总是被浮动的盒子整蒙圈了，作为小师父的我就给他梳理一下： 浮动就是页面布局中是某些盒子添加了float:left 或float:right的类名或属性。其具有以下特点：浮动的元素会脱离标准流；浮动后的元素会... 查看详情
html清除浮动的几种方式
清除浮动的几种方式？答：1，父级div定义height原理：父级div手动定义height，就解决了父级div无法自动获取到高度的问题。简单、代码少、容易掌握，但只适合高度固定的布局.2，结尾处加空div标签clear：both原理：在浮动元素的后... 查看详情
清除浮动的几种方式
为什么清除CSS浮动这么难？因为浮动会使当前标签产生向上浮的效果，同时会影响到前后标签、父级标签的位置及widthheight属性。而且同样的代码，在各种浏览器中显示效果也有可能不相同，这样让清除浮动更难了。解决浮动引... 查看详情