Styling Links

Links have standard states that most browsers understand

link

The state of the link before being activated. What the user will see if the links are on the page and unvisited.

visited

Occurs after the link has been visited.

hover

Occurs as you "hover" your mouse over the link.

focus

Occurs when link has focus or is tabbed to.

active

Occurs as the link is being clicked. (holding down the mouse on the link)

Let's take a look...

This is a sample paragraph with a few links in it. Let's link to monster.com for some job search. Check out all the great jobs that are available for people who know CSS and XHTML. Now let's take a look at some jobs at careerbuilders.

Notes

1. Links states are considered pseudo classes.
2. The links should be defined in order to prevent inconsistent behavior. For example if the visited stated is defined after the hover then once a link is visited the hover state may not work properly. The order is link, visited, hover, active (LoVeHA).

Your Turn

1. Change the style of links on page1.html