Realizar Menu

#1 (**permalink**) 28/09/2006, 13:57

Hola, mirar estoy haciendo un menu con links a diferentes apartados pues bien quiero hacerlo de tal manera que quede asi un link debajo de otro y que al poner el cursor sobre el ponga una linea debajo tipo link normal:

Pero esto esta hecho con una imagen, yo os doy la imagen que quiero de fondo del link es esta:

Pues es que no hay manera de poner que el link quede con la imagen de fondo esa y con el link normal que quede centrado tanto verticalmente como horizontalmente al medio.

Ayudenme ha realizarlo por favor lo he intentado de 10 maneras distientas y no doy con ello.

Ayuda por favor. Un saludo

urgido · #2 (**permalink**) 28/09/2006, 15:12

aquí te pongo un código, espero y te guste:

Código HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Documento sin t&iacute;tulo</title>
<style type="text/css">
<!--
a:link {
	text-decoration: none;
}
a:visited {
	text-decoration: none;
}
a:hover {
	text-decoration: underline;
}
a:active {
	text-decoration: none;
}
-->
</style></head>

<body>
<table width="20%" border="0" cellspacing="0">
  <tr>
    <td background="botonxl3.jpg" style="border-bottom:1px #00FF00 solid" valign="middle" align="center"><a href="" style="color:#FFFFFF; font-weight:bold; font-size:12px; font:Georgia, 'Times New Roman', Times, serif">Menu 1</a></td>
  </tr>
  <tr>
    <td background="botonxl3.jpg" style="border-bottom:1px #00FF00 solid" valign="middle" align="center"><a href="" style="color:#FFFFFF; font-weight:bold; font-size:12px; font:Georgia, 'Times New Roman', Times, serif">Menu 2</a></td>
  </tr>
  <tr>
    <td background="botonxl3.jpg" style="border-bottom:1px #00FF00 solid" valign="middle" align="center"><a href="" style="color:#FFFFFF; font-weight:bold; font-size:12px; font:Georgia, 'Times New Roman', Times, serif">Menu 3</a></td>
  </tr>
  <tr>
    <td background="botonxl3.jpg" style="border-bottom:1px #00FF00 solid" valign="middle" align="center"><a href="" style="color:#FFFFFF; font-weight:bold; font-size:12px; font:Georgia, 'Times New Roman', Times, serif">Menu 4</a></td>
  </tr>
</table>

</body>
</html>

#3 (**permalink**) 28/09/2006, 15:14

Gracias por tu respuesta ¿pero hay alguna manera de hacerlo con capas DIV Y CSS? sino usare las tablas q me diste

urgido · #4 (**permalink**) 28/09/2006, 15:21

Código HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Documento sin t&iacute;tulo</title>
<style type="text/css">
<!--
a:link {
	text-decoration: none;
}
a:visited {
	text-decoration: none;
}
a:hover {
	text-decoration: underline;
}
a:active {
	text-decoration: none;
}
-->
</style></head>

<body>
	<div style=" padding-top:2px; text-align:center; height:15px; width:170px; background:url(botonxl3.jpg); border-bottom:1px #00FF00 solid" valign="middle" align="center"><a href="" style="color:#000000; font-weight:bold; font-size:12px; font:Georgia, 'Times New Roman', Times, serif">Menu 1</a></div>
	<div style=" padding-top:2px; text-align:center; height:15px; width:170px; background:url(botonxl3.jpg); border-bottom:1px #00FF00 solid" valign="middle" align="center"><a href="" style="color:#000000; font-weight:bold; font-size:12px; font:Georgia, 'Times New Roman', Times, serif">Menu 2</a></div>
	<div style=" padding-top:2px; text-align:center; height:15px; width:170px; background:url(botonxl3.jpg); border-bottom:1px #00FF00 solid" valign="middle" align="center"><a href="" style="color:#000000; font-weight:bold; font-size:12px; font:Georgia, 'Times New Roman', Times, serif">Menu 3</a></div>
	<div style=" padding-top:2px; text-align:center; height:15px; width:170px; background:url(botonxl3.jpg); border-bottom:1px #00FF00 solid" valign="middle" align="center"><a href="" style="color:#000000; font-weight:bold; font-size:12px; font:Georgia, 'Times New Roman', Times, serif">Menu 4</a></div>	

</body>
</html>

#5 (**permalink**) 28/09/2006, 15:43

muchas gracias urgido por tu ayuda