Css. Specificity

more specific style wins

p {} 1 point, simple tag selector
.myClass {} 10 point
.myId {} 100 points
<div style = "text-align: center"></ div> 1000 points

Lets say we have the same tag

<img id="logo" class="highlight" src="logo.gif" />

if we define the same attribute in id and class css elements which will win ? id of course because its specificity equals to 100.

If specificity the same – last style wins !

Example, lets say we have

<p class="byline">Written by <a class="email"
href="mailto:jean@cosmofarmer.com">Jean Graine de Pomme</a></p>

...and in css

p .email { color: blue; }
.byline a { color: red; }

Which style will win ? Both specificity equals to 11. Winner is the last one in css, i.e. red color.

!Important

Also, if we defined same attribute in external table, internal table and inside tag, then inside tag wins !!!