Cascading Style Sheets/Hyperlinks
The a
selector matches hyperlinks. There are the four pseudo-classes that are commonly used with it: link
, visited
, hover
and active
. Rules using these pseudo-classes should be given in this order so that the dynamic effects take precedence over the visited/unvisited state. The following example will display a link that is black, changes to green when the mouse is over it, and changes to pink when active (whilst the mouse is pressed over it).
a:link
{ color:black; background:gray }
a:visited
{ color:black; background:red }
a:hover
{ color:green }
a:active
{ color:pink }
When the mouse is over an unvisited link both the a:link
selector and the a:hover
selector are matched. Since the hover rule appears last its color
declaration takes precedence over the link rule's color
declaration. Since the hover rule does not alter the background
property the result is green text on a gray background.
The :link
and :visited
pseudo-classes can only be used with the a
selector. CSS2.1 allows the :hover
and :active
pseudo-classes to be used with other elements. However, Internet Explorer only allows :hover
on anchor elements.