如何 - 清除浮动 (Clearfix)

了解如何使用 "clearfix" 技巧清除浮动。

如何清除浮动 (Clearfix)

浮动元素后面的元素将围绕其流动。使用"clearfix" hack 来解决问题：

如果一个元素比包含它的元素高，并且它是浮动的，它会溢出到其容器之外。

然后我们可以添加overflow: auto;到包含元素来解决这个问题：

.clearfix {
overflow: auto;
}

只要您能够控制边距和填充（否则您可能会看到滚动条），overflow:auto clearfix 就可以很好地工作。这新的、现代的clearfix hack但是使用起来更安全，大多数网页都使用以下代码：

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

提示：在我们的中了解有关浮动的更多信息CSS 浮动教程。