CSS: !important use code sharing-CSS Tutorial-php.cn

CSS: !important use code sharing

黄舟

Release： 2017-07-27 11:11:34

Original

2066 people have browsed it

This article is tested using the latest IE10, firefox and chrome (as of 22:23:22 on May 27, 2013)

The principle of CSS:

We know that CSS written in different places has different priorities, the definition in the .css file < the attribute in the element style, but if you use !important, things will become different.

First of all, let’s look at the following piece of code:

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>测试Css中的!Important区别</title> 
</head> 
<style type="text/css">.testClass{ 
color:blue !important;
}</style><body>
    <p class="testClass" style="color:red;">
        测试Css中的Important    </p></body></html>

Copy after login

Although there is a definition of the testClass class in the style of the element, it is qualified with !important in the above css definition. The definition has the highest priority, and the performance is consistent whether it is in ie6-10 or Firefox and Chrome, both are displayed in blue.

This situation also shows that ie6 can recognize !important, but this is a flaw of ie6. If it is written in the following style, IE6 will not recognize it:

.testClass{ 
color:blue !important;
color:red;
}

Copy after login

In this way, it will appear in red when displayed under IE6.

Of course, you can also make ie6 recognize it through the following methods:

.testClass{ 
  
color:blue !important;  
}  
.testClass{ 

  
color:red;  
}

Copy after login

You can also make ie6 display blue through the above method.

The above is the detailed content of CSS: !important use code sharing. For more information, please follow other related articles on the PHP Chinese website!