Exemple du sélecteur :link. placez le souris sur les liens et voyez comment ils seront changés

Source Code: (back to article)

<!DOCTYPE html>
<html>
  <head>
    <title>Titre du document</title>
    <style>
      a{
      display:block;
      padding:5px 0 10px;
      font-weight:bold;
      }
      a.one:link { 
      color: #ccc;
      }
      a.one:visited { 
      color: #095484;
      }
      a.one:hover { 
      color: #8ebf42;
      }
      a.two:link {
      color: #ccc;
      }
      a.two:visited {
      color: #095484;
      }
      a.two:hover {
      font-size: 150%;
      }
      a.three:link {
      color: #ccc;
      }
      a.three:visited {
      color: #095484;
      }
      a.three:hover {
      background: #8ebf42;
      }
      a.four:link {
      color: #ccc;
      }
      a.four:visited {
      color: #095484;
      }
      a.four:hover {
      font-family: monospace;
      }
      a.five:link {
      color: #095484;
      text-decoration: none;
      }
      a.five:visited {
      color: #095484; text-decoration: none; 
      }
      a.five:hover {
      text-decoration: overline underline; 
      }
    </style>
  </head>
  <body>
    <h2>Exemple du sélecteur :link </h2>
    <p>
      <a class="one" href="#">Ce lien change la couleur</a>
      <a class="two" href="#">Ce lien change la taille de police</a>
      <a class="three" href="#">Ce lien change la couleur de l'arrière-plan</a>
      <a class="four" href="#">Ce lien change la famille de police</a>
      <a class="five" href="#">Ce lien change la décoration de texte</a>
    </p>
  </body>
</html>