关于—— !important

定义及语法

!important是CSS1就定义的语法，作用是提高指定样式规则的应用优先权。语法格式{ cssRule !important }，即

写在定义的最后面，例如：

box{
    color:red !important;
}

 

解释：在box中color为red的优先级最高。

W3c的解释

CSS企图创造一个平衡作者和用户之间的级层样式表。

默认情况下,CSS规则按级层覆盖，例如在.CSS文件中的定义可以被style标签的定义覆盖，反之则不行。

然而,对覆盖平衡而言,加上一个“!important”就优先于正常的CSS规则。

例:

p { text-indent: 1em ! important }

p { font-style: italic ! important }

p { font-size: 18pt }

p { text-indent: 1.5em}

p { font: normal 12pt sans-serif}

p { font-size: 24pt }

注：

Font属性是以上属性的快捷方式，属性如下：

属性名称: 'font'属性值: [ [ <'font-style'> || <'font-variant'> || <'font-weight'> ]? <'font-size'> [ / <'line-height'> ]? <'font-family'> ]适合对象: 所有元素是否继承: yes百分比备注: 只在font-size使用

例如：

P { font: 12pt/14pt sans-serif } P { font: 80% sans-serif }P { font: x-large/110% "new century schoolbook", serif }P { font: bold italic large Palatino, serif }P { font: normal small-caps 120%/120% fantasy }

在这些规则中 未被覆盖的有：

p { text-indent: 1em ! important }

p { font-style: italic ! important }

p { font-size: 24pt }

浏览器识别

ie7,ie8,firefox,chrome等高端浏览器下，已经可以识别 !important属性， 但是IE 6.0仍然不能完全识别。

情况如下：

当含! important的样式属性被同一个{}里的样式覆盖时，IE 6.0认为! important较低

div{
    color:#f00!important;
    color:#000;
}

在上述代码中，IE6及以下浏览器div的文本颜色为#000，!important并没有覆盖后面的规则；其它浏览器下div的文本颜色为#f00覆盖了后面的规则

而

当 ! important 的样式属性和覆盖它的样式属性单独使用时(不在一个{}里)，IE 6.0则认为! important优先级较高，例如：

div{color:#f00!important;}
div{color:#000;}

在上述代码中，IE6及以下浏览器中div的文本颜色表现与其它浏览器一致，都为#f00

总结：

在编写与 ! important 的样式属性有关的样式属性时，建议不在一个{}里编写，而是独立出来，单独另外写，例如：

div{color:#f00!important;}

div{
    color:#000;
    ……
}