做!重要信息:在IE6中不工作?

IE6支持!重要的是当规则与!重要信息是选择器中该属性的最后一条规则。

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

因此,请考虑以下示例:

#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所做的是将每个选择器的“height”值解析为选择器中存在的最后一个“height”声明(其他规则可能适用,但我相信这是您的标准情况)。然后,它根据选择所有这些中最具体的“高度”!重要和选择特殊性规则。它有效地忽略不是其选择器中最后一个的“height”声明。

其他浏览器将考虑'!重要提示:分析每个选择器的“高度”值时,在比较基于的选择器之前!重要和特殊的规则。

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

不过,如果没有一个 非常 少量的IE6调整,您希望将每个调整作为IE6漏洞对其进行CSS注释。

心理例证

假设选择一个CSS规则是一个问题:1)获取与元素匹配的所有规则;2)决定使用哪一个规则。假设内联样式标记只是另一个选择器,除非我另有说明。

在每个其他浏览器中,如果要获取某个元素的“高度”,它大约会执行以下操作:

1. 对于每个选择器,选择最后一个!重要的高度如果有,否则只是最后一个高度。

2. 选择所选“高度”为的最特定的选择器!重要的是高度,否则是内联样式高度,否则是最特定的选择器。

在IE6中,它大约执行以下操作:

1. 为每个选择器选择最后一个高度。

2. 选择所选“高度”为的最特定的选择器!重要的是高度,否则是内联样式高度,否则是最特定的选择器。