Glossy Menu Vertical
voir aussi
GLOSSY MENU HORIZONTAL
C'est un menu vertical CSS qui utilise un mince,
l'image de fond de répéter que les changements
lorsque la souris survole un lien.
L'image est brillante regardant avec un tire
t à la base pour créer une séparation
entre les liens de Nice.
/*noter :vous pouvez traduire les commentaires de votre css, le modifier et le traduire a votre langue via ce lien http://translate.google.com */
Le code css
<style type="text/css">
/*noter :vous pouvez traduire les commentaires de votre css, le modifier et le traduire a votre langue via ce lien http://translate.google.com */
.glossymenu{
list-style-type: none;
margin: 5px 0;
padding: 0;
width: 170px;
border: 1px solid #9A9A9A;
border-bottom-width: 0;
}
.glossymenu li a{
background: white url(media/glossyback.gif) repeat-x bottom left;
font: bold 13px "Lucida Grande", "Trebuchet MS", Verdana, Helvetica, sans-serif;
color: white;
display: block;
width: auto;
padding: 3px 0;
padding-left: 10px;
text-decoration: none;
}
* html .glossymenu li a{ /*IE only. Actual menu width minus left padding of A element (10px) */
width: 160px;
}
.glossymenu li a:visited, .glossymenu li a:active{
color: white;
}
.glossymenu li a:hover{
background-image: url(media/glossyback2.gif);
}
</style>
Le code html
<ul class="glossymenu">
<li><a href="votre lien cici " >votre nom de page ici</a></li>
<li><a href="votre lien cici " >votre nom de page ici</a></li>
<li><a href="votre lien cici " >votre nom de page ici</a></li>
<li><a href="votre lien cici " >votre nom de page ici</a></li>
<li><a href="votre lien cici " >votre nom de page ici</a></li>
<li><a href="votre lien cici" style="border-bottom-width: 0">votre nom de page ici</a></li>
</ul>
0 commentaires:
Enregistrer un commentaire