Tutorial CSS

La couleur de mes liens

Jeudi 15 Mars 2007 à 10h56

La couleur des liens est configurée par défaut en bleu et en violet.
En bleu quand ils n'ont pas encore été visités.
En violet quand ils ont déjà été visités.

Voyons comment faire pour leur donner une autre couleur:

Pour cela la CSS nous offre la fonction a.
(Comme dans h1 a qui définit la couleur du titre du journal qui est un lien vers la page d'acceuil du journal)
Je dis fonction mais en fait comme margin ou padding il s'agit d'une balise css.

Un exemple pour mieux comprendre:

a {
  color: red;
  text-decoration: none;
  }

color : red; permet de donner une couleur rouge à mes liens.
text-decoration: none; les liens ne sont pas soulignés.

Placé dans la partie : /* Définition des paramètres de la page */
On fixe tout les liens de la page en rouge et non souligné.

Un autre exemple:

a {
 color: #000000;
 text-decoration: none;
 }

Qui me donnera des liens noirs non soulignés.

Ce qui donnerait a peu près çà:

/* Définition des paramètres de la page */
body {
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12px;
        color: gray;
        }
a { 
  color: #000000; 
  text-decoration: none;
  }

Et voilà tout mes liens deviennent noirs non soulignés.
Sauf les liens qui sont défini dans le reste de la feuille CSS.
Nous avons vu ensemble h1 a qui défini les paramètres du titre.

Parcourons la feuille, et dans l'ordre nous allons trouver:

Mais ce n'est pas tout! la CSS offre de multiples possibilités.
Voyons comment fixer une couleur à mes liens quand mon curseur passe dessus:

a : hover {
 color: red;
 text-decoration: none;
 }

Qui donnera des liens rouges non souligné quand mon curseur passe dessus.