CSS 的 !important 声明何时不起作用?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/189621/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-29 20:01:59  来源:igfitidea点击:

When does CSS's !important declaration not work?

css

提问by Matt Mitchell

I am wondering if someone can put a bit of an authoritative reference summary of when the !important declaration in CSS does notwork to override inline styles.

我想知道是否有人可以提供一些权威参考摘要,说明 CSS 中的 !important 声明何时无法覆盖内联样式。

采纳答案by keparo

There are many factors involved in determining which styles override one another. The lower a style declaration appears in the cascade, and the more specificit is in targeting the element, the more it will weigh against other styles.

确定哪些样式会相互覆盖涉及许多因素。样式声明在级联中出现的越低,它针对元素的定位越具体,它与其他样式的权重就越大。

This is the CSS2 standardfor style inheritance:

这是样式继承的CSS2 标准

  1. If the cascade results in a value, use it.
  2. Otherwise, if the property is inherited, use the value of the parent element, generally the computed value.
  3. Otherwise use the property's initial value. The initial value of each property is indicated in the property's definition.
  1. 如果级联产生一个值,请使用它。
  2. 否则,如果属性是继承的,则使用父元素的值,通常是计算值。
  3. 否则使用属性的初始值。每个属性的初始值在属性定义中指明。

Internally, the browser will calculate the specificity of a rule, according to the standard. The !important declaration will add weight to the rule, but dynamically assigning a style attribute will often take precedence, because it is usually more-highly specified..

在内部,浏览器将根据标准计算规则的特殊性。!important 声明将增加规则的权重,但动态分配样式属性通常会优先,因为它通常被更严格地指定。

回答by Matt Mitchell

Well so far research seems to suggest:

到目前为止,研究似乎表明:

  • IE7 supports !important.
  • FireFox 2 and 3 support !important.
  • IE6 supports !important in standards compliant mode.
  • IE7 支持 !important。
  • FireFox 2 和 3 支持 !important。
  • IE6 在标准兼容模式下支持 !important。

However, IE6 (possible IE7) does not support !important in this case:

但是,在这种情况下,IE6(可能是 IE7)不支持 !important :

someselector {
  property: value !important;
  same-property: another-value;
}

It will use the second value (the last listed).

它将使用第二个值(最后列出的值)。

This is confirmed by this page:

页面证实了这一点

In Internet Explorer 6 and earlier, if an important declaration appears before a normal declaration for the same property within the same declaration block, the normal declaration will overwrite the important declaration.

Internet Explorer 6 and 7 give importance to a declaration when an illegal identifier is used in place of the keyword important, instead of ignoring the declaration as they should.

在 Internet Explorer 6 及更早版本中,如果重要声明出现在同一声明块中相同属性的普通声明之前,则普通声明将覆盖重要声明。

当使用非法标识符代替关键字 important 时,Internet Explorer 6 和 7 会重视声明,而不是像应有的那样忽略声明。

Gizmo's comment states that Safari and Opera support !important.

Gizmo 的评论指出 Safari 和 Opera 支持 !important。

回答by Dr8k

I'm pretty sure not all browsers recognise the !important declaration. But can't remember which ones do off the top of my head. Will check and get back to you.

我很确定并非所有浏览器都能识别 !important 声明。但不记得哪些是在我头上做的。将检查并回复您。

[EDIT] I can confirm IE6 and earlier do not recognise !important (unless the browser is in standards compliance mode - not the default).

[编辑] 我可以确认 IE6 及更早版本不识别 !important(除非浏览器处于标准合规模式 - 不是默认模式)。

You can use !important to override an inline rule. But also remember that inline rules can be tagged !important as well.

您可以使用 !important 来覆盖内联规则。但也要记住,内联规则也可以标记为 !important。