A definition: Cascading is a mechanism for solving conflicts CSS declarations, the whole process is stacked, the browser automatically done according to the rules.
Second lamination process:
1. Compare Priority: Priority of a statement, and its origin and importance of the
Source: Author style sheets, browser default style sheet, user style sheets
Importance: The property value plus! important important statements
- The browser's default stylesheet declaration
- User stylesheet general statement
- On the stylesheet general statement
- Author style sheets Important Notice
- User style sheets Important Notice
(Priority from low to high)
2. Compare particularity:
Each statement has a particularity
When a collision occurs, it will retain the particularity of high and low of the special nature will be eliminated
The special nature of a declaration, depending on the size range of rules apply
The larger the scope rule, the lower the specificity, the scope of the smaller, the higher specificity.
Inline style> ID selector> selector class> element selectors> wildcard selector (high to low specificity)
The final calculated color: green win.
Weights:
!important ----> Infinity
Inline style ----> 1000
id ----> 100
class | property | pseudo-class ----> 10
Tags | pseudo-element ----> 1
3. Compare the source order: last statement appeared to win all the other eliminated.
After these three steps, there will be only a statement win out, all others are eliminated
Wildcard ----> 0
The higher the value of the special nature of high weight.
Example:
Final Results: