在网上查了很多写关于css important的。说实话,他们几乎写的都是一样的。不知道是哪个复制哪个的,错误都是一样的,差点把我误导了。所以,我觉得根据自己查阅的资料和自己的理解解释下css important!
其实important的作用就是提高这个css属性优先级。我不管这个属性在IE里是不是个BUG。我这里只讲使用方法!
important分为两种使用情况:
(例一)1.IE7及以上版本和其它主流浏览器
div { color:red !important; color:blue; }
important提高这个css属性优先级,important这行放上面和下面的效果是一样的!它会告诉IE7及以上版本和其它主流浏览器div的字体颜色为red,后面的相同属性会被忽悠!
(例二)2.IE6
div { color:red !important; color:blue; }
div的字体颜色为blue,因为IE6在相同属性(如color)中设置important,它是不认识的,所以color会被后面的blue覆盖前面的red。
css: #box div{ color:red; } .important_false{ color:blue; } .important_true{ color:blue !important; } html: <div id="box"> <div class="important_false">这一行末使用important</div> <div class="important_true">这一行使用了important</div> </div>
第一行(class="important_false")字体颜色显示为red,因为"#box div"优先级大于".important_false";这段代码在IE6中第二行(class="important_true")也显示为blue,和IE7及其它主流浏览器显示效果一样。当important出现在不同样式类(如importan_true,important_false),IE6才能识别。在例一同一个样式类(如:
#box div{
color:red;
color:blue!important;
}
)IE6是无法识别 !important,但是还是能识别 blue,所有color为blue,如果把color:blue!important;放到 color:red;前面,在IE6中color则显示为red。