Couleur de lien

Bonjour,
Je voudrais que lorsque l'on clique sur mon menu, le lien change de couleur (et il la garde tant que l'on n'a pas cliqué sur un autre lien). J'ai essayé ceci mais sa ne marche pas. Le lien en change pas de couleur:
a.mainlevel:active { color: green;} /* lien activé */ 
a.mainlevel:link,a.mainlevel:visited {
   /* background: #333;*/background:url(../images/menu_gauche.jpg) no-repeat;
	
	color: #ccc;
	display: block;
	margin: 0;
	padding: 8px 12px;
	text-decoration: none;
	height:25px;
	
}
a.mainlevel:hover
{
background: #2580a2 url("../images/hover.gif") left center no-repeat;
	color: #fff;
	padding-bottom: 8px;
}


Merci pour tous ceux qui peuvent m'aider
Configuration: Windows XP
Firefox 2.0.0.16

4 réponses

  1. Bonjour.

    Il n'y a pas de solution, à ma connaissance, en CSS, pour modifier la couleur (ou autre chose) du lien correspondant à la page actuelle.

    Tu peux toujours contourner le probème en créant une classe que tu assignes au lien en question.
    Exemple en php :
    function Menu() {
    ...
    // On va dire que tu stockes les liens du menu dans un tableau lien[]
    // Et l'adresse actuelle de ta page dans $page
    foreach ($liens as $item) {
    // On affiche le menu sous forme de liste
       echo '<li><a href="'.$item
       if ($item == $page) {
          // Pour afficher l'élément du menu correspondant à la page en cours
         echo ' class="actif"';
       }
       .'">'.$item.'</a></li>';
    }
    }

    Et dans le CSS :
    .actif {color:red;}
    

    1
    1. Contributeur
      salut
      tu as essayé onclik à la place de hover ?
      0
      1. je viens d'essayer onclick a la place de hover mais sa ne change rien.
        Je pense que le problème viens de active car il faut que je mette en couleur mon lien actif.
        Mais sa ne marche pas...
        0
        1. Essai ceci : (il faut par ordre link, visited, hover puis active)
          Memo LoVe HAte)

          a.mainlevel:link, a.mainlevel:visited {
          /* background: #333;*/background:url(../images/menu_gauche.jpg) no-repeat;

          color: #ccc;
          display: block;
          margin: 0;
          padding: 8px 12px;
          text-decoration: none;
          height:25px;

          }
          a.mainlevel:hover
          {
          background: #2580a2 url("../images/hover.gif") left center no-repeat;
          color: #fff;
          padding-bottom: 8px;
          }
          a.mainlevel:active { color: green;} /* lien activé */

          @ Plus Andéa
          0