What term describes the weight of CSS selectors in determining precedence?

The story behind the answer

The term describing the weight of CSS selectors in determining precedence is specificity. Specificity is the selector-comparison system browsers use when multiple applicable rules set the same property on the same element. The rule with greater specificity generally wins within the same cascade conditions.

Specificity is commonly represented as four components: inline styles, ID selectors, class/attribute/pseudo-class selectors, and type or pseudo-element selectors. An ID selector outranks any number of class selectors in the usual comparison model, while a class selector outranks a type selector. The comparison is lexicographic rather than ordinary decimal arithmetic.

A frequent mistake is treating specificity as the whole cascade. Origin, importance, cascade layers, and source order also affect which declaration applies. The !important flag changes priority, but it is not itself a selector weight. Inheritance is different again: it supplies a value from an ancestor only when the element has no winning declaration of its own.

Modern CSS features such as :where() and :is() make specificity more deliberate. :where() contributes zero specificity, while :is() takes the specificity of its most specific argument, helping authors control how easily rules can be overridden.

Source: Wikipedia · fact-checked Aug. 2026

Add question to a list

Choose a list to keep this question in: