Specificity Calculations

Specificity describes the weight of a selector and any declarations associated with it. The following table summarizes the components of specificity summation.

Selector type

Specificity

Universal selector

Combinators

0,0,0,0

Element identifier

Pseudo-element identifier

0,0,0,1

Class identifier

Pseudo-class identifier

Attribute identifier

0,0,1,0

ID identifier

0,1,0,0

Inline style attribute

1,0,0,0

Specificity values are cumulative; thus, a selector containing two element identifiers and a class identifier (e.g., div.aside p) has a specificity of 0,0,1,2. Specificity values are sorted in right-to-left precedence; thus, a selector containing 11 element identifiers (0,0,0,11) has a lower specificity than a selector containing just a single class identifier (0,0,1,0).

The !important directive gives a declaration more weight than nonimportant declarations. The declaration retains the specificity of its selectors and is used only in comparison with other important declarations.

..................Content has been hidden....................

You can't read the all page of ebook, please click here login for view all page.
Reset
18.119.118.99