IE6 !important bug刨根问底

GD Star Rating
loading...

以前总听人说IE6不支持 !important,但是真的是这样么?最好的办法那就是亲身实践,Go!

测试1:

#a {
    color: red !important;
    color: blue;
}

测试结果:#a为蓝色blue。

我的理解:IE6下面在同一个{}下的属性设置!important会失效,后面的样式会覆盖前面的。

测试2:

#b {
    color: red !important;
}
#b {
    color: yellow;
}

测试结果:#b为红色red。

我的理解:在非同一个{}下,!important在IE6下是没问题的。

测试3:

#c {
    color: red !important;
    color: blue;
}
#c {
    color: black;
}

测试结果:#c为黑色black。

我的理解:第一个{}内blue覆盖red,然后第二个{}内的black由于在后面,会覆盖blue,所以最终结果会是black

测试4:

#d {
    color: blue;
    color: red !important;
}
#d {
    color: black;
}

测试结果:#d为红色red。

我的理解:第一个{}内red覆盖blue,同时由于其有important,会覆盖第二个{}内的black,所以最终结果会是red。

总结:

  1. 在同一个{}内时设置!important的样式失效,后面的样式会覆盖前面的。
  2. 非同一个{}下,先用规则1得出每一个{}内的样式,如果参与比较的2个或多个{}内有!important,则!important是有效的。

参考资料:

IE6 !important bug刨根问底, 4.0 out of 5 based on 3 ratings

已有2条评论 发表评论

  1. dev /

    提醒博主Sitemap该更新啦!

    GD Star Rating
    loading...
  2. 有点蓝 /

    看来只要写法正确,还是有效的。

    GD Star Rating
    loading...

发表评论