Question

我们如何通过CSS动态应用！important规则？

比方说，我有很多（1000多个）实用程序类：

.text-align-left   { text-align: left   }
.text-align-right  { text-align: right  }
.text-align-center { text-align: center }

现在，除了在每个实用程序中添加！important之外，我们如何动态应用它？就像下面的“ override”类一样，我们仅在其中添加！important：

.class-to-override.override { rule: def !important }

谢谢

Answer 1

我知道这是一个非常老的问题，但我会给它一个机会：

CSS和dynamically不是最好的朋友，因此简短的答案是：您不能附加{{1} }关键字添加到规则的末尾，在CSS中是动态的。

尽管您可以通过将选择器加倍：!important而不是.text-align-left.text-align-left（根据W3文档：https://www.w3.org/TR/selectors-3/#specificity的工作和允许）来增加特异性，但我认为这不是在这种情况下会很有帮助。

您最好的选择可能是创建一组新的帮助程序类，并仅在需要时使用它们。

.text-align-left

通过CSS动态应用！important

1 个答案: