salve ho fatto preso questo menu che funziona bene ma ho bisogno di fare anche un sotto menu, ma non so come implementare questo css, chi mi può dare una mano?
body {
font:10px verdana, helvetica, sans-serif;
}
h6 { /*stile per i titoli dei menu*/
font-size:1em;
font-weight:bold;margin:2px 0;
padding:.3em 1em;
}
/** MENU 1 ** roll-over basato solo sui colori **/
ul.menu1 {
width:150px;
list-style:none; /* elimino i punti elenco */
margin:0; padding:0; /* elimino i rientri delle liste */
}
ul.menu1 li a {
display:block; /* il link occupa tutto lo spazio orizzontale */
text-decoration:none; /* elimino la sottolineatura, che si tratta di un link si capisce dalla struttura */
padding:0 1em; /* lascia spazio far il bordo del menu e il testo del link */
height:2em;line-height:2em; /* altezza del link: height e line-height devono avere il medesimo valore */
}
ul.menu1 li { display:inline } /*elimina lo spazio fra gli elementi della lista introdotto da Opera*/
ul.menu1 li a:link, ul.menu1 li a:visited {
background:#ccc;
color: #009;
} /* colori per il link */
ul.menu1 li a:hover, ul.menu1 li a:active {
background: #eee;
color:#c00;
} /* colori per l'effetto roll-over */

/** MENU 2 ** roll-over basato sui colori e sui bordi laterali **/

ul.menu2 {
width:150px;
list-style:none; /* elimino i punti elenco */
margin:0; padding:0; /* elimino i rientri delle liste */
}
ul.menu2 li a {
display:block; /* il link occupa tutto lo spazio orizzontale */
text-decoration:none; /* elimino la sottolineatura, che si tratta di un link si capisce dalla struttura */
padding:0 1em; /* lascia spazio far il bordo del menu e il testo del link */
height:2em;line-height:2em; /* altezza del link: height e line-height devono avere il medesimo valore */
border-width:5px;border-style:none solid; /* aggiungo dei bordi laterali */
}
ul.menu2 li { display:inline } /*elimina lo spazio fra gli elementi della lista introdotto da Opera*/
ul.menu2 li a:link, ul.menu2 li a:visited {
background:#ccc;
color: #009;
border-color:#009
} /* colori per il link */
ul.menu2 li a:hover, ul.menu2 li a:active {
background: #eee;
color:#c00;
border-color:#66c;
} /* colori per l'effetto roll-over */

/** MENU 3 ** sfondo sfumato **/

ul.menu3 {
width:150px;
list-style:none; /* elimino i punti elenco */
margin:0; padding:0; /* elimino i rientri delle liste */
}
ul.menu3 li a {
display:block; /* il link occupa tutto lo spazio orizzontale */
text-decoration:none; /* elimino la sottolineatura, che si tratta di un link si capisce dalla struttura */
padding:0 1em; /* lascia spazio far il bordo del menu e il testo del link */
height:2em;line-height:2em; /* altezza del link: height e line-height devono avere il medesimo valore */
}
ul.menu3 li {
display:inline;
background:url(sfumato.png); /*pre-load immagine*/
}
ul.menu3 li a:link, ul.menu3 li a:visited {
background:#ccc;
color: #009;
} /* colori per il link */
ul.menu3 li a:hover, ul.menu3 li a:active {
background:#eee url(sfumato.png) 100% 0 repeat-y;
color:#c00;
} /* colori per l'effetto roll-over */