barra de navegacion......

[ryu_on_ice]

Estoy tratando de hacer una barra de navegacion de tres botones/links.
pero sobre una imagen como background ya puesta en el Div,.....asi sin ningun efecto por el momento, solo que enlace a otra pagina



quisiera saber como hacerle para ubicar el link dentro de esa div.....alguna idea

saludos y gracias!!

[Mariela_Fiad]

Solo pon los enlaces dentro del <div> que tiene por background una imagen


suponiendo que el tu div se llama <div id="enlaces">

Código HTML:

<div id="enlaces">
<a href="">Enlace 1</a>
<a href="">Enlace 2</a>
<a href="">Enlace 3</a>
</div> 

Código CSS:

#enlaces {background: url(../../fondoenlaces.png)}
 

Si no quieres que la imagen se repita agregas no-repeat como valor a la propiedad background.

<div> es un elemento en bloque por lo que ocupa toda una linea puedes ajustar su ancho con width o si quieres que solo ocupe el espacio reservado por los enlaces agregas al div desde el CSS

Código CSS:

#enlaces {display: inline}
 

si quieres espacio de relleno entre los enlaces y donde finaliza la imagen, se lo agregas con padding. Si no es esto lo que quieres lograr, dime contestando este mensaje. Saludos

[ryu_on_ice]

ok esto es lo que tengo...

<div id="barra_menu"></div>

en el css tengo esto:
#barra_menu {
background: url(imagenes/menu.jpg) center no-repeat;
width:720px;
height:50px;
clear:both;
}

en la imagen usada en el background, es donde tengo los links; me explico. En la imagen menu.jpg ya tengo puesto los 3 enlaces, lo que quiero hacer es habilitar los links ahi donde ya estan dibujados los enlances en el menu.jpg.....lo que pasa es que primero hice el menu en photoshop, con las formas de los botones..y asi como esta me gusta..por eso comentaba no quiero ponerle efectos de rollover etc, solo habilitar el enlace....

si se puede hacer eso??

[danneg]

la mejor forma de hacer un menu es con listas desordenadas

Código HTML:

<ul id="menu">
  <li><a>Menu</a></li>
  <li><a>Menu</a></li>
  <li><a>Menu</a></li>
</ul>
 

Código CSS:

#menu li {
   float: left;
}
 

puedes buscar mas informacion sobre esto, busca un tuto de css y xhtml