Partage
  • Partager sur Facebook
  • Partager sur Twitter

Bouton actif !?

Sujet résolu
Punisher
  • HTML / CSS
    19 avril 2006 à 20:20:28

    Bonjours à tous,
    Je voudrais savoir comment peut on faire pour que ;
    ce bouton :
    Image utilisateur
    Change en ce bouton :
    Image utilisateur

    Lorsque l'on pointe la sourie dessu. Ce bouton est un lien.
    Voilà, j'epsère que je suis clair. Merci d'avance ^^
    • Partager sur Facebook
    • Partager sur Twitter
    p2s
      19 avril 2006 à 20:22:54

      ba tu cree un div avec rien dedans et en css tu met qu'il fasse la taille de l'image et qu'elle l'ai en fond ;) et en hover tu change le background
      • Partager sur Facebook
      • Partager sur Twitter
      skorpios
        19 avril 2006 à 20:27:01


        #bouton{
        background-image : url("ton image de base");
        background-repeat: no-repeat;
        height: xpx  ; // la hauteur de ton bouton
        width: xpx; //la largeur de ton bouton
        }
        #bouton:hover{
        background-image : url("ton image lors du passage de la souris");
        background-repeat: no-repeat;
        height: xpx  ; // la hauteur de ton bouton
        width: xpx; //la largeur de ton bouton
        }
        • Partager sur Facebook
        • Partager sur Twitter
        DeaX
          19 avril 2006 à 20:29:31

          si t'avais lu les cours de Mateo tu le saurais, bon je suis simpa :

          le xHTML
          <a class="bouton" href="ton lien"></a>


          le CSS
          a:hover /* Quand le visiteur pointe sur le lien */
          {
             background: url("lien de limage bleu");
             width: largeur de limage;
             height: hauteur de limage;
          }
          a /* Lien normal */
          {
             background: url("lien de limage grise");
             width: largeur de limage;
             height: hauteur de limage;
          }


          Normalement c'est ça ! ;)
          • Partager sur Facebook
          • Partager sur Twitter
          Punisher
          • HTML / CSS
            19 avril 2006 à 20:53:18

            merci mais j'ai toujour un problème ( DeaX, j'ai lus les cours du SdZ de a à z ;) )
            Voici ce que j'ai mi :
            <a class="tutoriels" href="tutoriels.html"></a><br/>


            .tutoriels
            {
            padding-left: 18px;
            padding-right: 5px;
            background-image: url("blue_theme/menu_tutoriels.png");
            height: 30px;
            width: 160px;
             }
             
             .tutoriels:hover
            {
            padding-left: 18px;
            padding-right: 5px;
            background-image: url("blue_theme/menu_tutoriels_2.png");
            height: 30px;
            width: 160px;
             }


            Et ceci me donne un petit carré d'une vintaine de pixels avec un petit bout du bouton gris. Et si je le survole je voit qu'il ce met en bleu, mais il ets trop petit...


            • Partager sur Facebook
            • Partager sur Twitter
            strucky
              19 avril 2006 à 21:54:23

              .tutoriels
              {
                display: block;
              }
              • Partager sur Facebook
              • Partager sur Twitter
              Punisher
              • HTML / CSS
                19 avril 2006 à 22:00:06

                Merci sa marche :)

                Problème résolue
                • Partager sur Facebook
                • Partager sur Twitter

                Bouton actif !?

                × Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
                × Attention, ce sujet est très ancien. Le déterrer n'est pas forcément approprié. Nous te conseillons de créer un nouveau sujet pour poser ta question.
                • Editeur ●
                • Markdown