Calculation rules of 1.CSS
The particularity of the selector value expressed as four parts, denoted by 0,0,0,0
The special value of the ID selector, 0,1,0,0
Class selectors, selectors or pseudo-class property, 0,0,1,0
Elements and pseudo elements, 0,0,0,1
* Wildcard selector does not contribute to specificity, 0,0,0,0
! important is the highest weight value, that is the highest priority
2.CSS priority
In general:
Inline style> ID selector (#id)> attribute selector (a [href = ""]) = pseudo class selector (: hover)> tag selector (span, p) = pseudo-element selector (:: before)
However, when the same weight class, defined later overwrite the previous CSS