HTML Tools — CSS Specificity

CSS Specificity

Calculates the CSS Specificity of a CSS Selector

Specifity is calculated by a point score as follows:

selector
id	1	0	0
class attribute selector pseudo-class	0	1	0
tag pseudo-element	0	0	1

Clicking the Calculate will generate the results.
This includes a specificity result in the form [id,class,tag]

If there is a second Selector string, it too will be calculated, and the comparison will appear below.

CSS also includes the following overriders:

!important: This will override properties even if the selector is less specific.
If the element includes an inline style attribute (style="…"), it will override the above rules.
This especially includes rules set in JavaScript using the style property.