<!DOCTYPE html>
<!-- 
  Note: link pseudo classes 
  won't work on mobile devises as
  on mobile there's no cursor. The 
  following selectors only work on
  desktop browsers.
-->

<html>
  <head>
    <style>
    /* unvisited link 
     - when a link is not visited 
     - the anchor must have 
       the href attribute */
    a:link {
      color: blue;
    }

    /* hovered link 
     - when a link has 
       been visited before */
    a:visited {
      color: red;
    }

    /* hovered link 
     - when the mouse cursor 
       rolls over a link */
    a:hover {
      color: green;
    }

    /* selected link 
     - when a link is being clicked */
    a:active {
      color: black;
    }
    </style>
    <title>Pseudo-classes</title>
  </head>
  <body>
    <a href="http://www.google.com">
      Example link
    </a>
  </body>
</html>

RelatedPost