XHTML Class Guide and Reference
Make your own web pages

Using CSS to format Links

Removing underlines

As CSS has become popular many sites have gotten rid of the underlines under their links, relying on colors or other factors to set their links apart. To make links not be underlined use :

a { text-decoration:none; }

Changing colors on Mouseover

This trick works in IE5+ and Netscape 6. It won't work in Netscape 4.

Define different "pseudo-classes" for the different link states link, hover, and visited. For example:

a:link { color:#0000cc } link will be blue by default
a:visited { color:#9900cc } link will be purple if it has been visited
a:hover { color:#990000 } link will be red when the mouse is hovering over it

To have different styles of links within a page you can combine a link style with a class style. (You can do this with other tag types also.) It works best to specify the class in the <a> tag, before the href attribute for example:

<a class="navlink" href="page3.htm">

Specify it in the style section or style sheet like this:

a:link.navlink { color:#0000cc }
a:visited.navlink { color:#9900cc }
a:hover.navlink { color:#990000 }