How is CSS specificity calculated?

Explanation

CSS specificity is calculated as a four-part value (a,b,c,d): a = inline styles (1000), b = ID selectors (100 each), c = class/attribute/pseudo-class selectors (10 each), d = element/pseudo-element selectors (1 each). Higher specificity wins. Inline styles have the highest specificity. !important overrides all specificity. When specificity is equal, the later rule wins. Understanding specificity prevents unexpected style overrides and reduces the need for !important.