CSS:Bouton en relief

Un article de WikiTuto.

Jump to: navigation, search

Sommaire

Exemple

On peut même rajouter, sans plus de poids, un effet de relief et une couleur finale différente une fois que le site a été visité, ainsi que la simulation du bouton qui s'enfonce au passage de la souris :

par défaut :

quand l'adresse a déjà été visitée :

quand le pointeur de la souris s'y pose :

Voir aussi

Source html

<a href=".." class="bouton">Cliquez ici !</a>
     

Source css

a.bouton:link, a.bouton:visited, a.bouton:hover{
 width:150px;
 height:30px;
 text-decoration:none;
 color:white;
 text-align:center;
 font-weight:bold;
 padding:5px;
 border-width:0.3em;
 border-color:silver;
}
a.bouton:link{
 background-color:#000080;
 border-style:outset;
} 
a.bouton:visited{
 background-color:#00aaFF;
 border-style:outset;
}
a.bouton:hover{
 background-color:#0000FF;
 border-style:inset;
}

Voir aussi

Source

Dominique Gonzalez

Boîte à outils
Annuaire gratuitCe site est listé dans la catégorie Informatique : Aide et astuces en informatique Annuaire