Study: CSS Selector specificity

A selector's specificity is calculated as follows:

  • count the number of ID selectors in the selector (= a)
  • count the number of class selectors, attributes selectors, and pseudo-classes in the selector (= b)
  • count the number of type selectors and pseudo-elements in the selector (= c)
  • ignore the universal selector

Selectors inside the negation pseudo-class are counted like any other, but the negation itself does not count as a pseudo-class.

Concatenating the three numbers a-b-c (in a number system with a large base) gives the specificity.

9. Calculating a selector's specificity - Selectors Level 3

TypeValueClassPoints (s, a, b, c) *

* The level "s" is incremented once, if the declaration is from a 'style' attribute rather than a rule with a selector.