css - 为什么 CSS 框架不必要地使用 !important 标签？

Question

与其说这是一个问题，不如说这是一场辩论，但我觉得互联网上没有太多内容涵盖这个主题。

例如，foundation 带有数百个 !important 标签，这些标签在我看来并不需要它们:

.text-center { text-align: center !important; } 

有很多与此类似的 css，在我看来这是不好的做法，我想回答的问题是为什么 css 框架要使用它们？ Bootstrap 和 Foundation 是两个主要的 css 框架，都使用它们。

我一直被告知在 css 中使用重要的标签是非常糟糕的做法，应该只用于 IE。

Answer 1

如果您编写自己的 CSS，则可以在需要时自由添加更具体的规则:

.center        { text-align: center; }
.foobar        { text-align: left; }
.foobar.center { text-align: center; }

但是，CSS 框架无法预测您将如何排列 HTML。因此，执行 !important 而不是生成数千个更具体规则的组合更容易。示例:

.center               { text-align: center; }
.foobar               { text-align: left; }
.barbaz               { text-align: right; }
 /*
  * assuming .center must be centered regardless of other rules and
  * !important must be avoided at the same time, we need to do this
  */
.foobar.center        { text-align: center; }
.barbaz.center        { text-align: center; }
.foobar.barbaz.center { text-align: center; }