Créer des boutons au style de votre forum
Niveau: Intermédiaire | Par:Mario | Validé par: Mario | En date du: 06/03/2011
Dans ce tutoriel nous allons apprendre à créer des boutons au style de notre forum tout en
CSS vu que certains scripts ne sont pas compatibles avec tous les navigateurs.
Donc, commençons par la base du bouton, c'est-à-dire
le HTML :
Par exemple dans une page d'accueil je vais mettre ceci :
- Code:
-
/*CODE BY MARIO À NE PAS EFFACER*/
<a href="URL" class="button">
<span class="UNE_CLASS">TEXTE</span>
</a>
Avec cette structure vous pouvez faire n'importe quel bouton.
Maintenant
le CSS:
- Code:
-
a.button{
background:url('URL_DE_L'IMAGE_DU BOUTTON');
display:block;
color:#CODE_COULEUR;
font-weight:bold;
height:30px;
line-height:29px;
margin-bottom:14px;
text-decoration:none;
width:191px;
}
a:hover.button{
color:#CODE_COULEUR;
}
.UNE_CLASS{
background:url('URL_IMAGE') no-repeat 10px 8px;
text-indent:30px;
display:block;
}
Voilà, nous avons fini. Merci d'avoir visualisé ce tutoriel.