Explain the basic rules of CSS Specificity

• ID selectors have a higher specificity than attribute selectors.

/*wins*/
a#a-02 { background-image : url(n.gif); }
a[id="a-02"] { background-image : url(n.png); }

• Contextual selectors are more specific than a single element selector.
• The embedded style sheet is closer to the element to be styled.
• The last rule defined overrides any previous, conflicting rules.

p { color: red; background: yellow }
p { color: green } // wins

• A class selector beats any number of element selectors.

.introduction {} //wins
html body div div h2 p {}

• The universal selector has a specificity of 0, 0, 0, 0.