Home > Menu Design > Crossbar Menu (2)
Attraverso l' uso di semplici liste e dei CSS2 è possibile formattare un numero indefinito di menu orizzontali e verticali.
a cura di: Fabio Regina in collaborazione con Andrea Di Pizio | 29 maggio 2006
<ul id="navlist"> <li id="active"><a id="current" href="#">Renoir</a></li> <li><a href="#">Monet</a></li> <li><a href="#">Cezanne</a></li> <li><a href="#">Manet</a></li> <li><a href="#">Degas</a></li> </ul>
ul#navlist{ list-style:none; font: 90% Arial, Helvetica, sans-serif; } ul#navlist li{ margin:0; padding:0; display:inline; font-size:1.2em; } ul#navlist li a{ padding:.3em .5em; background:transparent; color:#000; font-weight:bold; text-decoration:none; border-bottom:4px solid #9ec630; } ul#navlist li a:hover{ padding:.3em .5em; background:url(crossbar2.png) 0 0 repeat; color:#000; font-weight:bold; text-decoration:none; border-bottom:4px solid #9ec630; } ul#navlist li a#current{ padding:.3em .5em; background:url(crossbar2.png) 0 0 repeat; color:#000; font-weight:bold; text-decoration:none; border-bottom:4px solid #9ec630; }
[ Torna all’inizio della pagina ]
[ Torna all’inizio della pagina ]
[ Torna all’inizio della pagina ]
[ Torna all’inizio della pagina ]
[ Torna all’inizio della pagina ]
[ Torna all’inizio della pagina ]
[ Torna all’inizio della pagina ]
Sito realizzato dal Laboratorio di Accessibilità e Usabilità del CSI-Piemonte - Privacy, cookies e accessibilità