CSS Specificity

specifity.md

Some html:

<a id="redLink" class="red link" href="#">Click me!</a>

CSS specifity, low to high:

a { color: red; }
body a { color: red; }
a.red { color: red; }
body a.red { color: red; }
a.red.link { color: red; }
body a.red.link { color: red; }
a#redLink { color: red; }
body a#redLink { color: red; }
body a#redLink.red { color: red; }
body a#redLink.red.link { color: red; }
style="color: red;"
a { color: red  !important; }
body a { color: red  !important; }
a.red { color: red  !important; }
body a.red { color: red  !important; }
a.red.link { color: red  !important; }
body a.red.link { color: red  !important; }
a#redLink { color: red  !important; }
body a#redLink { color: red  !important; }
body a#redLink.red { color: red  !important; }
body a#redLink.red.link { color: red  !important; }
style="color: red !important;"