6.4.3 Calculating a selector's specificity

Chapter 6 - Assigning property values, Cascading, and Inheritance - 6.4.3 Calculating a selector's specificity

Go to the relevant page of the specification.

c21-pseu-cls-000 (interact)
anchor
c21-pseu-id-000 (interact)
anchor
c32-cascading-000
Cascading Order
specificity-001
Calculating specificity - Specificity 0010 vs. 0001
The attribute selector has an higher specificity over the element selector - specificity 0010 takes precedence over 0001.
specificity-002
Calculating specificity - Inline Style
Specificity of the inline style trumps all other selectors.
specificity-003
Calculating specificity - Specificity 0100 vs. 0011
The ID attribute in a selector has the higher specificity than the combined pseudo-class and element selectors - specificity 0100 takes precedence over 0011.
specificity-004
Calculating specificity - Specificity 0011 vs. 0010
The combined pseudo-class and element selectors have a higher specificity than the attribute selector - specificity 0011 takes precedence over 0010.
specificity-005
Calculating specificity - Specificity 0002 vs. 0001
An element selector with a pseudo-element selector wins over a pseudo-element selector - specificity 0002 takes precedence over 0001.
specificity-006
Calculating specificity - Pseudo-element vs. simple element
The combination of a pseudo-element selector with an element selector takes takes precedence over simple and single element selector - specificity 0002 takes precedence over 0001.
specificity-007
Calculating specificity - Specificity 0001 vs. 0000
The element selector has a higher specificity over the universal selector - specificity 0001 takes precedence over 0000.
specificity-008
Calculating specificity - specificity 0012 vs. 0002
The combined specificity of an element selector, with a pseudo-class selector and a pseudo-element selector achieves an higher specificity than the combined specificity of an element selector with a pseudo-element selector.
specificity-009
Calculating specificity - specificity 0003 vs. 0002
First-line selector with highest specificity wins - specificity 0003 take precedence over 0002.