Hola en principio para el menú lo único que necesitas para el cambio de imágenes es esto:
Código:
ul {
padding:0;
list-style:none;
margin:0px;
}
li{
padding:0;
list-style: none;
}
a {
padding:15px 0 0;
margin:0 auto;
display: block;
background: url(css/i/tu_fondo.jpg) no-repeat;
width: 125px;
height: 40px;
text-align: center;
}
a:hover{
background:url(gfx/fondo_hover.png);
background-repeat:no-repeat;
background-position:center;
}
Faltan: active, visited y focus, fíjate que es en <a> en la hoja de estilos donde tengo las imágenes y el tamaño ancho y alto que tiene que ser el tamaño de la imagen.
html
Código:
<ul>
<li><a href="index.htm">link 1</a></li>
<li><a href="servicios.htm">link 2</a></li>
<li><a href="tiendas.htm" >link 3</a></li>
<li><a href="contacto.htm">link 4</a></li>
</ul>