CSS Link Style Order (link pseudo classes)

Each of these pseudo classes shares specificity —they are all styling links. If a pseudo class falls into more then one category, such as visited and hovered, the last set of CSS rules listed will take precedence. That means if the visited state's style is listed after the hovered state and their styling is different, the hover may stop working once the link has been visited.

The order:

1. a:link (an unvisited link)
2. a:visited (a visited link)
3. a:hover (mouse over)
4. a:active (activated / clicked)

Trick for Remembering (LVHA):

L	o	V	e	H	A	t	e
I		I		O	C
N		S		V	T
K		I		E	I
		T		R	V
		E			E
		D

'a' vs. 'a:link'

Styling the selector as 'a' instead of 'a:link' is a good way of writing the styles that will be common to most of the other states. The other pseudo classes will inherit the styles because they are all share the anchor selector.

If you write a set of rules for the selector 'a:link' they are specific to an unvisited link and will not be inherited.
The shared rules would have to be written for each of the pseudo classes.

Example using 'a:link':

a:link{
font-size:2em;
font-family:helvetica,arial,sans-serif;
color:blue;
}
a:visited{
font-size:2em;
font-family:helvetica,arial,sans-serif;
color:green;
}

a:hover{
font-size:2em;
font-family:helvetica,arial,sans-serif;
color:purple;
}

Example using 'a':

a{
font-size:2em;
font-family:helvetica,arial,sans-serif;
color:blue;
}
a:visited{
color:green;
}

a:hover{
color:purple;
}

The only time you must use 'a:link' is if you are using named anchors for jump links.