What is the use of!important in CSS? The role of!important in CSS

This article brings you to the content is about CSS in!important what is the use? CSS in the role of!important, there is a certain reference value, there is a need for friends to refer to, I hope you have some help.

The role of!important in CSS

Add {*rule!important} to write to ie6.0,ie7.0 and Firefox hack

* For IE series browser can be recognized, Firefox browser can not be recognized;

！ Important only IE7.0 and Firefox can be identified, but IE6.0 cannot be applied successfully

Difference

(1) The difference between IE and Firefox hack: border:2px solid #f00; *border:1px solid #f00;

(2) The difference between Ie6.0 and Ie7.0, Firefox hack: border:1px solid #f00!important;border:2px solid #f00;

Analytical

In (1), the reason is to put the * behind because Firefox does not recognize * and caused only one border, and the IE series two times after the border settings, the latter property overrides the previous attribute, it is a pixel border.

In (2), the reason for putting!important in the first border setting is because it increases the priority of this border, even if the border is not valid at one time or even in the nth settings. But Ie6.0 does not accept this rule, which causes it to apply the second border setting, which is the second time it overrides the first principle, not that it does not recognize!important, so its border is a 2-pixel red box.

Example

Css

#Box {      color:red!important;      Color:blue; }

Html

<p id= "box" > in different browsers, the color of this line of words should be different! </p>

This example should be commonly seen by the use of important, in the IE environment, the line is blue, in Firefox, for the red

Related recommendations:

How to use!important declaration to enforce precedence in CSS

The use of!important in CSS and the performance under IE6 _html/css_web-itnose