How to use important in css

In CSS, you can write "!important" after the style to increase the application priority of the specified style rule. The syntax is "selector {style: value!important;}". It is not recognized in IE6, but can be used in IE7 and other browsers to handle browser compatibility.

The operating environment of this tutorial: Windows 7 system, CSS3&&HTML5 version, Dell G3 computer.

CSS written in different places has different priorities. The definition in the css file

!important syntax

selector {style: value!important;}

!important provides developers with a way to increase the weight of styles. It should be noted that !important is a declaration of the entire style, including the attributes and attribute values ​​of this style

Example

<style>
a{
    color:green!important;
}
#main a{
     color:blue;
 }
 </style> 
 <div>
     <a>!important实例</a>
 </div>

For the above code, if the important attribute is not added, the hyperlink will The color is blue, but after adding important, the priority is increased and the display color is green.

Note:

• If !important is used for a shorthand style attribute, then the sub-properties represented by this shorthand style attribute will be affected by !important .

• The keyword !important must be placed at the end of a line of styles and before the semicolon on the line, otherwise it will have no effect. (However, the space before the semicolon will not affect it)

• If for some special reasons, you have to declare two same properties in one code block, then please add !important after the first attribute, because doing so will give the first attribute more weight in all browsers except IE6 (this is a hack that is only available in IE6, but will not affect your CSS)

Recommended learning: css video tutorial

The above is the detailed content of How to use important in css. For more information, please follow other related articles on the PHP Chinese website!