!important 在 IE6 中不起作用吗？答案

【问题标题】：Does !important not works in IE6?!important 在 IE6 中不起作用吗？
【发布时间】：2010-06-17 11:29:31
【问题描述】：

!important 不能在 IE6 中工作吗？如果我们也需要 IE6 兼容性，那么我们不应该使用!important吗？

【问题讨论】：

@jitendra - 老实说，在 726 多个问题中，您还没有学会谷歌吗？ ie6 important 给了我第一个答案链接的内容。只需先用谷歌搜索，您就可以减少一半的问题。
一个您遇到问题的具体示例将有助于提供更全面的答案，尽管 Graphain 已经涵盖了最明显的问题。
如果谷歌没有给出好的答案，那么我在这里问。如果 google 能找到 is 并不意味着不应该在这里问问题。我从人们对 SO 的回答中获得了丰富的知识，即使对于同一主题，谷歌搜索中也有很多文章可用。对我来说，SO 的回答给了我比任何博客上的任何文章更好的答案。
您问“在 ie6 中是否 !important 不起作用”，在 google 上 1 分钟会引导您找到数十篇文章说明它的错误。为什么不更具体地表达您的问题，或者粘贴您不理解的描述，以便其他人可以阐明它对您的含义？
@Mike Tierney - 我只想知道 IE 6 是否支持 !important 或者它以特定方式支持。在此页面上msdn.microsoft.com/en-us/library/… 提到“部分”以支持 !important 在 IE6 中。我想知道什么是“部分”支持。在此页面上没有关于此的信息。

标签： css cross-browser internet-explorer-6

【解决方案1】：

当带有 !important 的规则是选择器中该属性的最后一条规则时，IE6 支持 !important。

这听起来有点令人困惑，但如果您声明一个 !important 高度，它必须是给定选择器中“高度”的最后一个声明。

因此请考虑以下示例：

#selector { height: 100px; height: 150px !important; }
Result: All browsers: 150px;

#selector { height: 100px; height: 150px !important; }
td#selector { height: 200px; }
Result: All browsers: 150px;

#selector { height: 100px; height: 150px; }
td#selector { height: 70px; height: 200px !important; }
Result: All browsers: 200px;

#selector { height: 100px !important; height: 150px; }
Result: All modern browsers but ie6: 100px; ie6: 150px;

#selector { height: 100px !important; height: 150px; }
td#selector { height: 200px; }
Result: All modern browsers but ie6: 100px; ie6: 200px;

#selector { height: 100px; height: 150px; }
td#selector { height: 70px !important; height: 200px; }
Result: All modern browsers but ie6: 70px; ie6: 200px;

ie6 所做的是将每个选择器的“高度”值解析为选择器中存在的最后一个“高度”声明（其他规则可能适用，但我相信这是您的标准情况）。然后它根据 !important 和选择器特异性规则从所有这些中选择最具体的“高度”。它有效地忽略了选择器中不是最后一个的“高度”声明。

在根据 !important 和特异性规则比较选择器之前，其他浏览器会在解析每个选择器的 'height' 值时考虑 '!important'。

这样做的一个“好处”是所有其他合理的浏览器都将使用您的“重要”样式，而 ie6 将选择该选择器中的最后一个规则声明。

除非只有非常少量的 ie6 调整，并且您希望将每个调整都作为 ie6 漏洞进行 css 注释，否则使用 ie6 特定样式表会更好。

心理例子

想象选择一个 CSS 规则是 1) 获取与元素匹配的所有规则，以及 2) 决定使用哪些规则。假装内联样式标签只是另一个选择器，除非我另有说明。

在所有其他浏览器中，如果您想获取元素的“高度”，它大致会这样做：

对于每个选择器，选择最后一个 !important 高度（如果有），否则只选择最后一个高度。
选择最具体的选择器，其中选定的“高度”是 !important 高度，否则为内联样式高度，否则为最具体的选择器。

在 ie6 中它大约是这样做的：

为每个选择器选择最后一个高度。
选择最具体的选择器，其中选定的“高度”是 !important 高度，否则为内联样式高度，否则为最具体的选择器。

【讨论】：

这有点不准确。 只要它不是此选择器中为该属性声明的最后一条规则，它就可以工作。在这个例子中，颠倒两个 height 规则，你会看到，确实，高度是 100px（即使通常会被不同的选择器覆盖）。
实际上，这与规则被解释的方式有关——通常最后一条规则获胜（很多黑客都是基于这个原则）。
谢谢约翰 - 我想我假设了很多，但只是复制了谷歌的答案。我已经更新了我的答案以反映并可能会进一步澄清。
如何级联和覆盖其他规则的属性。它们在不同的选择器中但嵌套。
我的例子已经涵盖了这一点。我进一步说明了它如何选择规则。请让我知道这是否可以解决问题。基本上有两个问题：1）每个选择器选择哪个规则和 2）选择哪个选择器（基于 1。） 2）对于所有浏览器都是相同的，但是 1）对于 ie6 不同（它并不总是为选择器选择 !important 规则，这意味着选择器可能不会被选择）。