css清除浮动几种方法 |动漫css模板

下面是几种清除浮动的方法：

.clearfix::after{
content: "";
display: block;
clear: both;
}

方法一：使用clearfix类

clearfix类是一个很常见的清除浮动方法，通过给父元素添加clearfix类，同时在其中加入一个伪元素，即可清除浮动。

.clearfix{
zoom: 1;
}
.clearfix::after{
content: "";
display: table;
clear: both;
}

方法二：使用zoom: 1

这种方法是在IE上常用的清除浮动方法，使用zoom: 1属性可以触发IE的“hasLayout”，从而清除浮动。另外，在clearfix::after中使用display: table;可以避免在IE7下出现无法清除浮动的问题。

.parent::before,
.parent::after{
content: "";
display: table;
}
.parent::after{
clear: both;
}

方法三：使用伪元素

这种方法比较简单，直接在父元素中加入一个伪元素，在其中设置clear: both;即可清除浮动。

以上是常用的三种清除浮动的方法，可以根据实际情况选择使用。