CSS3, JavaScript and HTML5 explained

SpeciFISHity: CSS Specificity

| January 8, 2012

Some people are confused by CSS Specificity, especially with all of the (not-so) new CSS3 Selectors. The image below may help make sense of CSS Specificity. X-0-0: The number of ID selectors, represented by Sharks 0-Y-0: The number of class selectors, attributes selectors, and pseudo-classes, represented by Fish 0-0-Z: The number of type selectors and pseudo-elements, represented by Plankton a la Spongebob *: The universal selector has no value