重要的问题是，在CSS中，你必须在所有情况下尽量避免深度选择(更优先级)，因为在未来你或其他人(通常是大项目)将需要在不改变原始样式的情况下覆盖这些样式，然后这个人将有有限的自由这样做。 他将需要使用!important，也与更深的选择器。

重要的问题是，在CSS中，你必须在所有情况下尽量避免深度选择(更优先级)，因为在未来你或其他人(通常是大项目)将需要在不改变原始样式的情况下覆盖这些样式，然后这个人将有有限的自由这样做。 他将需要使用!important，也与更深的选择器。

如果你想透支wp-plugins的默认属性，我认为有时候使用!important是“必须做的工作”。

我今天才用过，这是我完成任务的唯一方法。 也许不是做某事的好方法，但有时是唯一的方法。

!重要的力量，这句话总是适用，做这些事情:

即使选择器的特异性较低，级别也较低，它现在也优于特异性较高的选择器 如果该语句再次出现，通常会覆盖该语句，那么它将不再覆盖该重要语句

大多数情况下，可以避免使用!important，因为选择器的特殊性决定了哪个选择器生效，这就是级联样式的思想。然而，在某些情况下(我不太记得具体是什么情况了)，特异性就不那么符合逻辑了，我不得不在语句中强加!important。

不使用/避免的原因!

阻止用户使用自定义样式表(现在不能覆盖标记为重要的规则)，这破坏了某些人的可访问性 使代码更难阅读，因为大脑通常很容易接受特殊性，但记住什么是重要的会使代码更难阅读

我认为，在2014年底，当更多的规则被添加到工作草案中时，我们再次谈到这个问题是很重要的，不要对你的用户施加限制是非常重要的。我写这个小例子是为了解释发生这种事情的可能情况。这是从我在网上访问的一个真实的网站上截取的，可悲的是，我经常看到它。

表单文本编辑器字段

你有一个网站，你的网站依赖于填写表格和编辑文本。为了尽量减少眼睛疲劳，你尝试使用一种你认为每个人都可以接受的风格，因为你的用户主要是在晚上访问，你决定将背景颜色设置为白色，然后将文本颜色设置为黑色。默认情况下，表单是空白的，所以你输入文本(这次)以确保它可以工作:

...
background-color: black; /* I forgot important here, but it works fine on its own */
color: white !important;
...

几个月后，用户抱怨黑白相间太费眼了，但另一半人很喜欢，你怎么办?你添加了一个自定义主题，使用!important来覆盖内部样式，这样双方都满意，这就是它应该被用来做的:

...
background-color: white !important;   
color: black !important;
...

现在，这里发生了什么?你想要什么?如果您正确地记住了第一组中的!important标记，您就会注意到它不起作用，并且可能还记得您需要删除!important标记。但是你忘了一个…

没错，你得到了白底白文，如果用户尝试使用这种新风格(假设你保留了它)，他们就再也无法阅读你的网页了。

当然，您没有意识到这一点，因为文本框是空的。你认为它会起作用!(假设是开发者最大的敌人，它就像骄傲和傲慢一样)。

制定并遵守自我暗示的规则

因此，在设计覆盖原始完整的css规则集时，基本规则应该只使用!记住，它是为异常而设的，首先就会扰乱css的自然顺序和意义。在大多数情况下，你根本不需要使用它。

了解用户如何自定义颜色

随着诸如扩展等工具的存在和像'userstyles.org'这样的网站的存在，它的时尚对口，你冒着使用!important标签疏远用户的风险!请记住，时尚并不会压倒它们。

不要限制你的访客

如果你在一个样式上使用!important，确保你让用户可以关闭这个样式(我不是说通过浏览器内部的“开/关”开关)。看在上帝的份上，不要让它默认。

Ads

人们越来越少使用时尚来删除广告，所以我不认为保护广告的重要性真的是一个问题。它只会惹恼那些试图定制你的网站的人。

这个问题有点晚了，但它说的是“不管应用了什么其他风格，忽略它们，使用这个”。你可能会发现它有点困惑!因为在javascript中它不是一个运算符，但在CSS中它被称为一个分隔符令牌，只是表示优先级。这里有一个例子。

没有!重要的是:

.set-color{
  color: blue;
 }

.set-color{
  color: red;
 }

输出红色

!重要的底部属性(相同的)

.set-color{
  color: blue;
 }

.set-color{
  color: red !important;
 }

输出红色(本来是红色的)

!重要的顶部属性(相同的)

.set-color{
  color: blue !important;
 }

.set-color{
  color: red;
 }

输出蓝色(表示忽略红色，使用蓝色)