CSS style sheet priority

Why 80% of the code can not do farming architect? >>>

1, particularity

First look at the case of this example will happen:

1 .grape { color:Blue; }              
2 H1 { color: Red; }                 
3 <h1 class="grape">Meerkat <em>Central</em></h1>

H1 and H1 .grape match the above elements, then in the end which one to use it? .Grape proved to be the correct answer, the sentence is displayed in blue. According to the specification, general selectors HTML elements (H1, P, etc.) having 1 particularity, particularity class selector 10, ID particularity selector 100, the greater the weight the greater the value, it is preferred.

1 H1 { color: Red; }                  /* 特殊性 = 1 */                  
2 P EM { color: Blue; }               /* 特殊性 = 2  */             
3 .grape { color: Fuchsia; }            /* 特殊性 = 1 0 */             
4 P.bright { color: Yellow; }            /* 特殊性 = 11 */             
5 P.bright EM.dark{ color: Gray; }       /* 特殊性 = 12 */             
6 #ID01 { color: Red; }                /* 特殊性 = 100 */

 

Reproduced in: https: //my.oschina.net/weisenz/blog/200639