3D boutons CSS
En utilisant border-style d'un élément d'attributs CSS départ,
vous pouvez
facilement créer un bouton 3D regarder.
Un pas de plus sur le
bouton peut aussi apparaître déprimé si désiré, en passant
d'une valeur border-style de départ pour en médaillon.
Les exemples ci-dessous sont 100% CSS basée,
pour ne pas mentionner léger:
RSS
XML
Dynamic Drive
Le code css
<style type="text/css">
.rssbutton{
background-color: #ff6600;
border: 1px #ff6600 outset;
padding: 0 2px;
color: white;
text-decoration: none;
font: bold 10px Verdana;
}
.rssbutton:visited, .rssbutton:hover, .rssbutton:active{
color: white;
}
.cssbutton{
background-color: #d1ec4c;
border: 2px #d1ec4c outset;
padding: 1px 4px;
color: black;
text-decoration: none;
font: bold 90% "Lucida Grande", "Trebuchet MS", Verdana, Helvetica, sans-serif;
}
.cssbutton:visited{
color: black;
}
.cssbutton:hover{
border-style: inset;
background-color: #e3f48e;
padding: 2px 3px 0 5px; /*shift text 1px to the right and down*/
}
.cssbutton:active{
color: black;
}
</style>
Le code html
<p>
<a href="votre lien ici"class="rssbutton">RSS</a>
<a href="votre lien ici" class="rssbutton">XML</a>
</p>
<p><a href="votre lien ici" class="cssbutton">Dynamic Drive</a></p>
0 commentaires:
Enregistrer un commentaire