CSS Tutorial - CSS Links








HTML Anchor links can be styled with CSS property for its text color, background, font, and etc.

The following code adds color style to anchor link.

a {
  color:red;
}

In addition to the normal styles, anchor links can also be styled based on its states.

The four links states are:

  • a:link - a unvisited link
  • a:visited - a visited link
  • a:hover - a hovering(mouses over it) link.
  • a:active - a link being clicking

a:hover must come after a:link and a:visited in the CSS definition in order to be effective.

a:active must come after a:hover in the CSS definition in order to be effective. 

/* unvisited link */
a:link {
    color: red;
}

/* visited link */
a:visited {
    color: blue;
}

/* mouse over link */
a:hover {
    color: yellow;
}

/* selected link */
a:active {
    color: black;
}