Hola, estoy haciendo una web con un menú (hecho con una tabla) que se resalta cada vez que paso el mouse (es decir CSS hover) pero obviamente lo que se resaltan son las celdas de la tabla las cuales son cuadradas, lo que quiero es que esas celdas tendan bordes redondos o poder utilizar una imágen para los bordes de la celda.
Esta es la tabala que uso para el menú
Código:
<table style="width: 504px" cellspacing="0" cellpadding="0">
<tr>
<td class="mainmenu_select" style="width:72px">Home</td>
<td> </td>
<td class="mainmenu" style="width:90px" onclick="window.location.href='nosotros.htm'">Nosotros</td>
<td> </td>
<td class="mainmenu" style="width:90px" onclick="window.location.href='servicios.htm'">Servicios</td>
<td> </td>
<td class="mainmenu" style="width:80px" onclick="window.location.href='noticias.htm'">Noticias</td>
<td> </td>
<td class="mainmenu" style="width:110px" onclick="window.location.href='contacto.htm'">Contáctenos</td>
</tr>
</table>
y la class mainmenu es:
Código:
.mainmenu{
font-size:16px;
font-family:"Trebuchet MS";
font-weight:bold;
color:#666666;
text-align:center;
height:33px;
cursor:pointer;
}
.mainmenu:hover{
font-size:16px;
font-family:"Trebuchet MS";
font-weight:bold;
color:#FFFFFF;
background-color:#398336;
text-align:center;
height:33px
}
.mainmenu_select{
font-size:16px;
font-family:"Trebuchet MS";
font-weight:bold;
color:#FFFFFF;
background-color:#398336;
text-align:center;
height:33px;
cursor:default;
}
OJO: .mainmenu_select la uso cuanod nos encontramos en la página del menú.
Gracias!!!