Les feuilles de style .css

Hello tout le monde !

Bien voilà, c'est la première fois que je créer des feuilles de styles et voilà que je rencontre un petit souçi... normal vous allez me dire :)

Voilà mon problème : je voudrais que mes liens agissent de la meme manière que les liens de ce site (CCM). Jusqu'ici j'ai réussis, lorsque je pointe mon curseur sur un lien l'effet est présent, mais aprés avoir cliqué sur un lien, l'effet disparait ! C'est à dire que j'ai beau ballader mon curseur sur le lien rien ne se passe. j'ai tout essayé sauf la bonne solution ;) C'est donc pour ca que je suis là, pour avoir la bonne solution !

Je compte sur vous :)

Merci d'avance,

En direct de Gennevilliers (92)
:: Keo ::

7 réponses

  • Votes
  • Date
  • Date décroissante
  1. Contributeur
    Salut, et tu as mis quoi dans ton CSS !?

    Copie le ici !

    Et essaye ça :

    A {
    color:#FF0000;
    font:  Arial, Helvetica, sans-serif;
    text-decoration:none;
    }
    
    A:hover {
    color:#FFFF00;
    font:  Georgia, Times New Roman, Times, serif;
    text-decoration:none;
    }
    
    A:visited {
    color:#0000CC;
    font:  Times New Roman, Times, serif;
    text-decoration:none;
    }
    
    


    Linux is like sex, it's better when it's free.
    
    L'ignorance, c'est la mort ; le savoir, c'est la vie...
    1. Contributeur
      Sinon, pour avoir des liens d'aspect différent:

      Il suffit de déclarer des sous classes.

      Script CSS :

      <style>
      A.lien1:link { text-decoration:underline;color:red;font-size:10px }
      A.lien1:active {text-decoration:underline;color:red;font-size:10px }
      A.lien1:hover { text-decoration:underline;color:red;font-size:10px }
      A.lien1:visited { text-decoration:underline;color:red;font-size:10px }
      //Deuxieme lien
      A.lien2:link { text-decoration:none;color:green;font-size:14px} 
      A.lien2:active { text-decoration:none;color:green;font-size:14px } 
      A.lien2:hover { text-decoration:underline;color:red;font-size:14px;font-style:oblique} 
      A.lien2:visited { text-decoration:none;color:green;font-size:14px } 
      </style>


      Code HTML:
      <a href="#" class="lien1">Lien1</a>
      <a href="#" class="lien2">Lien2</a> 


      
      
      Linux is like sex, it's better when it's free.
      L'ignorance, c'est la mort ; le savoir, c'est la vie...
      1. salut, ta première proposition est corecte, c'est d'ailleurs celle-ci que je j'ai trouvé tout seul :) Mais sinon je vois pas trop comment fonctionne les sous-classes. Tu peux m'expliquer ?

        <b>En direct de Gennevilliers (92)
        :: Keo ::</b>
        1. Contributeur
          Re,
          et bien, il suffit de fire comme d'hab, sauf que tu précise une sous classe en plus !

          regarde :

          comme d'hab: c'est
          A:hover 
          !
          et avec la sous classe: c'est
          A.lien1:hover
          !

          Ensuite dans ton code HTML, il te suffit de préciser la sous-classe comme dans l'exemple !

          Ca permet d'avoir différent type de liens !

          ;-))

          Linux is like sex, it's better when it's free.
          
          L'ignorance, c'est la mort ; le savoir, c'est la vie...
          1. oui mais comment passer d'une classe à une autre ? je vois pas trop.

            <b>En direct de Gennevilliers (92)
            :: Keo ::</b>
            1. Contributeur
              je ne comprends pas ta question !

              8-O

              la classe du lien1 s'appelle avec lien1 et la classe du lien2 s'appelle avec lien2...

              :-)

              Linux is like sex, it's better when it's free.
              
              L'ignorance, c'est la mort ; le savoir, c'est la vie...
              1. Contributeur
                Re,
                je pense que tu confons classe .lien1, .lien2, et selecteur :hover, :visited, etc...

                PS: merci asevere !
                Linux is like sex, it's better when it's free.
                
                L'ignorance, c'est la mort ; le savoir, c'est la vie...