CSS Hyperlinks

You can use CSS to change the appearance and behaviour of hyperlinks. CSS uses the following states to determine how hyperlinks look and behave:

• A
• A:link
• A:visited
• A:hover
• A:active

Here's an example of the code that you might insert into a style sheet to achieve the desired effect.

A {font-family:Georgia,serif; font-size:large}
A:link {color:blue;}
A:visited {color: #660066;}
A:hover {text-decoration: none; color: #ff9900;
font-weight:bold;}
A:active {color: red;text-decoration: none}

Note that the A:hover must be placed after the A:link and A:visited rules, since otherwise the cascading rules will hide the effect of the A:hover rule. Similarly, because A:active is placed after A:hover, the active color (red) will apply when the user both activates and hovers over the A element.

Hyperlinks with no underline.

It can confuse your users if your hyperlinks aren't underlined. A more usable solution would be only to apply this behaviour to hyperlinks only when users hover over them.

Text rollovers

Use the A:hover selector.

Cursor effects

Use the cursor declaration.