Vai ai contenuti
Ti trovi in:   Home > CSS Menu > Menu n.02/O

CSS Menu - CSS Menu Design

CSS Menu orizzontali

Menu n.02/O - Source XHTML e CSS

Semplice menu con cambio immagine di fondo e colore delle descrizioni sul link attivo e al passaggio del mouse.

(X)HTML:

<div id="menu02o">
 <ul>
  <li><a href="#">Link 1</a></li>
  <li><a href="#">Link 2</a></li>
  <li><a href="#">Link 3</a></li>
  <li><a href="#">Link 4</a></li>
  <li><a href="#">Link 5</a></li>
 </ul>
</div>
			

CSS:

#menu02o {
width: 100%;
font: 80% Arial, Helvetica, sans-serif; 
}
#menu02o ul{
margin: 0;
padding-left: 0;
list-style: none;
}
#menu02o li{
font-size: 1.1em;
display: inline;
margin: 0;
padding: 0;
}
#menu02o a:link, #menu02o a:visited{
float:left;
background: url(cssdesign/menu2b.jpg) center top no-repeat;
background-color: #DFDBDB;
color: #000;
margin: 0em;
padding: 0.3em 1.5em 0.3em 1.5em;
text-decoration:none;
border-right: 1px solid #fff;
}
#menu02o a:hover, #menu02o a:focus, #menu02o a:active{
color: #fff;
background: url(cssdesign/menu2a.jpg) center top no-repeat;
background-color: #000;
}

JPEG:


immagine n.1 sfondo menu02/O
menu2b.jpg (a:link)

immagine n.2 sfondo menu02/O
menu2a.jpg (a:hover)


Artwork & Design Copyright 2000-     Ivano Montanari    Verona - Italy

Mappa del sito | Privacy | Informativa cookie | Accessibilità | Accesskey | Contattami

W3C Valid XHTML 1.0 Strict W3C Valid CSS ver.2 W3C-WAI Web Content Accessibility Guidelines 1.0 Level Triple-A conformance Layout senza tabelle