tags:

views:

324

answers:

2

How can I make a link in HTML turn a color when hovering and remove the underline using CSS?

+18  A: 

You want to look at the :hover pseudoselector, the color property, and the text-decoration property.

a:hover { color: red; text-decoration: none; }

To assure your hyperlink is styled as you want (and does not conflict with other style rules), use !important:

a:hover { color: red !important; text-decoration: none !important; }
strager
Ah yes, important is a good idea.
Pim Jager
Also note that IE6 (possibly 7, not sure) ignores !important
Pim Jager
+7  A: 

Also in addition to stragers answer, make sure to declare the pseudo classes in the LoVe HAte way. You have to declare :link first, then :visited, then :hover and then :active. Otherwise some browsers may not apply the pseudo classes.

a:link{
 /*this only apllies to named anchors*/
}
a:visited{
 /*possible styles for visited links*/
}
a:hover{
 /*when mouse hovers over a-tag*/
 text-decoration:none;
 color:red;
}
a:active{
 /*possible styles on active (when a-tag is clicked)*/
}
Pim Jager