为什么 HTML5 BoilerPlate、Blueprint 和 960.gs CSS 框架使用 Clearfix 而不是溢出：隐藏？

Question

为什么 HTML5 BoilerPlate、Blueprint 和 960.gs CSS 框架使用 Clearfix 而不是 overflow:hidden？

为什么overflow:hidden 不是首选？要每次都使用clearfix，我需要将clearfix 类添加到html 元素，但我可以将overflow:hidden 添加到css 中的元素而无需修改html。

请举例说明使用overflow:hidden的缺点

clearfix 班级是否没有将演示文稿与内容混合在一起？

Answer 1

我认为 .clearfix-class 不只是包含溢出的原因：隐藏；是因为在某些情况下，您不希望将溢出设置为隐藏，但您仍希望元素自行清除。

关于在您的 HTML 中使用 class="clearfix" 我绝对同意这是“将演示文稿与内容混合”。

就我个人而言，我使用 SASS 是为了避免对所有事情都使用类。使用 SASS mixin，我可以简单地去：

#foo {
    @include clearfix;
}

并且仍然可以从一个地方更改我所有的 clearfix 样式。

Answer 2

好吧，让我用一个问题来回答你的问题（然后回答他们）。

问：为什么我们在 CSS 中使用类？

A：为了让我们能够创建可重用的代码。

问：这很好，但它如何适用于这种情况？

A：当下一个浏览器引擎发布（可能 IE 再次破坏一切）并且您的溢出：隐藏不再工作时，您将不得不进入并更改您使用它创建的每个实例。而如果您使用的是该类，您所要做的就是在一个地方更新代码，瞧，一切正常。

tl;dr; 面向未来。