css styles and priority selector

Style priority:

[Formula 1 with the inline style] -> [embedded inside formula] -> [External outer chain-type] -> @ import url introduction of formula

 

// inline (inline style):
     < P style = "Color: Green; font-size: 40px;" > first paragraph </ P > 

// embedded (internal type): 
    < style type = "text / CSS " > 
        h1 of { font-size : 30px ; Color : Gold ; } 
        .content { Line-height : 2em ; Color : Blue ; font-size : 15px ; } 
        .bigText { font-size : 25px ;}
        #play{color:red}
    </style> 

//外链式（外部式）：
    <link href="style.css" rel="stylesheet" type="text/css">

//导入式：
    <style type="text/css">
        @import url("style.css");
    </style> 
  

 

Embedded inside the formula [up], outside the outer chain of formula [] with these two

2.css priority: the principle of proximity (within the same page, the higher the priority of the next style will overwrite the previous style)

　　Scope, the higher the priority;

　　The higher the target to be modified from closer distances style priority;

 

Priority selectors:

1. the row -> id -> class -> tag selector

We can use  ! Important  syntax to upgrade priority

P { 

　　Color : Red Important! ; // this statement is not supported IE6 

　　Color : Blue ;　　

}