CSS Anchors, Links

Estimated reading: 1 minute 51 views

Below are the various ways you can use CSS to style links.

 a:link {color: #009900;}
 a:visited {color: #999999;}
 a:hover {color: #333333;}
 a:focus {color: #333333;}
 a:active {color: #009900;}

Now lets take a look at what each one of the above link styles actually
does.

 a:link {color: #009900;}

The first on the list sets the color of a link when no event is occuring

 a:visited {color: #999999;}

The second sets the color a link changes to, when the user has already
visited that url

 a:hover {color: #333333;}

The third sets the color a link changes to as the user places their mouse
pointer over the link

 a:focus {color: #333333;}

The fourth is primarilly for the same purpose as the last one, but this
one is for users that are not using a mouse and are tabbing through the
links via there keyboards tab key, it sets the color a link changes to as
the user tabs through the links

 a:active {color: #009900;}

The fifth on the list sets the color a link changes to as it is pressed.

Share this Doc

CSS Anchors, Links

Or copy link