About -! Important

Definitions and grammar

! important CSS1 syntax definition, the role is to improve the specified style rules apply priority . Syntax {cssRule! Important}, i.e.,

Written in the definition of the final surface, such as:

box{
    color:red !important;
}

 

Explanation: In the box for the red color of the highest priority.

W3c explanation

CSS attempts to create a style sheet level layer of a balance between authors and users.

By default, CSS rules covering layer in stages, such as those defined in .CSS file may be defined to cover the style tag, but not vice versa.

However, the balance in terms of coverage, plus a "! Important" priority to the normal rules of CSS.

Example:

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 }

Note: Font property is a shortcut to the above properties, the properties are as follows: Attribute Name: 'font' property values:? [[< 'Font-style'> || < 'font-variant'> || < 'font-weight'>] < 'font-size'> [/ < 'line -height '>] <?' font-family '>] suitable for: whether all elements Inherited: yes percentage Note: use only the font-size E.g: 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 }

In these rules are not covered are:

p { text-indent: 1em ! important }

p { font-style: italic ! important }

p { font-size: 24pt }

Browser Recognition

Under ie7, ie8, firefox, chrome and other high-end browsers can already recognize! important attribute, but IE 6.0 is still not fully identified .

details as following:

When containing! Important style attributes are the same {} while covering in the style, IEs 6.0 considered! Important low

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

In the above code, the text color and the following browsers IE6 div is # 000, important and does not cover the following rules;! Div of other browsers text color to # f00 cover behind the rules

and

! Important when a style property and covering its style properties alone ( not in a {} ), IEs 6.0 is considered important priority! Higher , for example:

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

In the above code, IE6 browser, and the following div text color performance consistent with other browsers, are # f00

 

to sum up:

! Important when writing and style attributes about the style properties, it is recommended not {a} in writing, but independent, alone to write another, for example:

div{color:#f00!important;}

div{
    color:#000;
    ……
}