Foros del Web » Creando para Internet » CSS »

Consulta...hipervinculos no subrayados

Estas en el tema de Consulta...hipervinculos no subrayados en el foro de CSS en Foros del Web. Hola amigos, Quisiera una ayuda con respecto a este codigo, el cual no domino bien el tema por tanto espero me sepan orientar @import url("http://static.forosdelweb.com/clientscript/vbulletin_css/geshi.css"); ...
  #1 (permalink)  
Antiguo 25/02/2009, 12:49
Avatar de hoberwilly  
Fecha de Ingreso: julio-2008
Ubicación: Lima - Perú
Mensajes: 769
Antigüedad: 9 años, 5 meses
Puntos: 2
Pregunta Consulta...hipervinculos no subrayados

Hola amigos,
Quisiera una ayuda con respecto a este codigo, el cual no domino bien el tema por tanto espero me sepan orientar
Código php:
Ver original
  1. <!-- <html>
  2. <head>
  3. <style type='text/css'>
  4. .tit{text-decoration: none;}
  5. </style>
  6. </head>
  7. <body>
  8. <table border="0" cellpadding="0" cellspacing="0" align="center" width="1000" class="tit">
  9. <tr>
  10.  <td height="15" colspan="6"></td>
  11. </tr>
  12. <tr>
  13.  <td height="70" colspan="6"></td>
  14. </tr>
  15. <tr>
  16.  <td align="center" height="32" width="57"><a href="index.php" class="cabecera_menu" >INICIO</a></td>
  17.  <td align="center" width="103"><a href="index.php?p=1" class="cabecera_menu">NOSOTROS</a></td>
  18.  <td align="center" width="99"><a href="index.php?p=2" class="cabecera_menu">PRODUCTOS</a></td>
  19.  <td align="center" width="79"><a href="index.php?p=3" class="cabecera_menu">NOTICIAS</a></td>
  20.  <td align="center" width="115"><a href="index.php?p=4" class="cabecera_menu">CONTACTENOS</a></td>
  21.  <td width="542" align="right" class="menu_izquierdo_texto"></td>
  22. </tr>
  23. </table>
  24. </body> -->
se requiere que los enlaces no tengan subrayado.

Gracias de antemano,
  #2 (permalink)  
Antiguo 25/02/2009, 12:56
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 11 años, 2 meses
Puntos: 279
Respuesta: Consulta...hipervinculos no subrayados

Modifica:
Cita:
<style type='text/css'>
.tit a {text-decoration: none;}
</style>
o bien
Cita:
<style type='text/css'>
a.cabecera_menu {text-decoration: none;}
</style>
__________________
Visita mi nueva web idplus.org
  #3 (permalink)  
Antiguo 25/02/2009, 16:20
Avatar de hoberwilly  
Fecha de Ingreso: julio-2008
Ubicación: Lima - Perú
Mensajes: 769
Antigüedad: 9 años, 5 meses
Puntos: 2
Respuesta: Consulta...hipervinculos no subrayados

Gracias amigo Mikmoro por tu respuesta, estoy anotando.
Otra solucion que encontre en la web y quisiera me podrias ayudar es el siguiente:
1. tener un archivo externo de css
Código php:
Ver original
  1. <!-- <link href="css/tienda.css" rel="stylesheet" type="text/css"> -->

2. Este es parte del codigo:
Código php:
Ver original
  1. <!-- .cabecera_menu:link{
  2.     font-family: Arial;
  3.     font-size: 14px;
  4.     color: #C60063;
  5.     text-decoration: none;
  6. }
  7. .cabecera_menu:visited{
  8.     font-family: Arial;
  9.     font-size: 14px;
  10.     color: #C60063;
  11.     text-decoration: none;
  12. }
  13. .cabecera_menu:hover{
  14.     font-family: Arial;
  15.     font-size: 14px;
  16.     color: #FFFFFF;
  17.     text-decoration: none;
  18. }
  19. .cabecera_menu:active{
  20.     font-family: Arial;
  21.     font-size: 14px;
  22.     color: #C60063;
  23.     text-decoration: none;
  24. } -->
La consulta es el siguiente:
a. Que diferencias se tienen entre: link, visited, hover, active
b. Y como implementarlo para k al pasar el raton por una celda (<td>)pinte esta
Código php:
Ver original
  1. <!-- <td align="center" height="32" width="57" onmouseover='this.style.background="#C10061"' onmouseout='this.style.background=""'><a href="index.php" class="cabecera_menu" >INICIO</a></td> -->
avanze con esto pero me parece no adecuado
c. Y existe la manera de como al momento de pasar por la celda ya se realiza un link (no al pasar el mouse en la palabra INICIO, que eso ya esta), osea por las dos maneras?

Gracias de antemano,
  #4 (permalink)  
Antiguo 25/02/2009, 21:14
 
Fecha de Ingreso: mayo-2008
Ubicación: En algun lado!
Mensajes: 86
Antigüedad: 9 años, 7 meses
Puntos: 1
Respuesta: Consulta...hipervinculos no subrayados

Hola hoberbilly, la diferencia es que cumplen disitnta funcion
link es el el estilo que se muestra apenas entras a la pagina, visited es el estilo del link que te indica que ya lo visitaste, hover es cuando le pasas el mouse por encima y active es el estilo cuando lo clikeas.

En el codigo que vos pegas lo podes simplificar de la siguiente manera

Código:
 .cabecera_menu:link, .cabecera_menu:visited, .cabecera_menu:hover,  .cabecera_menu:active {
    font-family: Arial;
    font-size: 14px;
    color: #C60063;
    text-decoration: none;
Ves que queda mas "limpio"??
Eso siempre y cuando quieras que el estilo de link, active, hover y visited sea el mismo...
Ahora si los queres trabajar por separado con distintos estilos cada uno te conviene dejarlos como los tenes.

Para que una celda se "pinte" cuando le pasas por arriba tenes que usar el atributo hover
Podes hacer asi

Código:
td:hover {
background: #ff0000;
}
Tenes que adaptarlo vos porque aplicado de ese modo afectaria a todas las tablas y todas las "TD" de tu pagina.

En cambio si lo queres para una td especifica podes usar

Código:
td.pintada:hover {
background: #ff0000;
}
para ser mas especifico y pintar la que vos quieras usando el siguiente esquema

Código:
<table>
<tr>
<td class="pintada">Esta celda se pinta cuando le pases el mouse</td>
<td>Esta celda no se pinta cuando le pases el mouse</td>
</tr>
</table>
La pregunta C no la entendi :S

Espero se haya entendido.

Saludos ;)
  #5 (permalink)  
Antiguo 26/02/2009, 07:06
Avatar de hoberwilly  
Fecha de Ingreso: julio-2008
Ubicación: Lima - Perú
Mensajes: 769
Antigüedad: 9 años, 5 meses
Puntos: 2
Respuesta: Consulta...hipervinculos no subrayados

Muchas gracias Malcomxar, de hecho que tus explicaciones me han servido de mucho para enterderlo el codigo.
Al respecto de la pregunta C:
Quisiera se ingresara al siguiente link (http://www.emitations.com/), aqui en los links al pasar el mouse por la celda (ojo no pasar por las palabra INICIO, que tambien es correcto) se linkea a la otra pagina:

<td align="center" height="32" width="57" onmouseover='this.style.background="#C10061"' onmouseout='this.style.background=""'><a href="index.php" class="cabecera_menu" >INICIO</a></td>

Espero quede claro esta ultima consulta, gracias otra vez
  #6 (permalink)  
Antiguo 26/02/2009, 07:57
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 11 años, 2 meses
Puntos: 279
Respuesta: Consulta...hipervinculos no subrayados

Deberías hacerlo así:

HTML:
Cita:
<td align="center" height="32" width="57"><a href="index.php" class="cabecera_menu" >INICIO</a></td>
CSS:
Cita:
a.cabecera_menu {display: block;
width: 100%;
height: 100%;
}
a.cabecera_menu:hover {background-color: #C10061;}
Ejemplo funcionando
__________________
Visita mi nueva web idplus.org
  #7 (permalink)  
Antiguo 26/02/2009, 13:53
Avatar de hoberwilly  
Fecha de Ingreso: julio-2008
Ubicación: Lima - Perú
Mensajes: 769
Antigüedad: 9 años, 5 meses
Puntos: 2
Respuesta: Consulta...hipervinculos no subrayados

Muchas gracias otra vez Mikmoro, solo una consultita al realizar el arreglo los links se me visualizan en la parte superior de las celdas?
  #8 (permalink)  
Antiguo 26/02/2009, 16:06
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 11 años, 2 meses
Puntos: 279
Respuesta: Consulta...hipervinculos no subrayados

Prueba añadiendo a "a.cabecera_menu", line-height: 32px;
__________________
Visita mi nueva web idplus.org
  #9 (permalink)  
Antiguo 26/02/2009, 16:34
Avatar de hoberwilly  
Fecha de Ingreso: julio-2008
Ubicación: Lima - Perú
Mensajes: 769
Antigüedad: 9 años, 5 meses
Puntos: 2
Respuesta: Consulta...hipervinculos no subrayados

Para cerrar el tema, con unas consultas al respecto por favor,
Quisiera saber como funciona display: block; width: 100%; y este ultimo line-height: 32px (porque 32px);

Saludos,
  #10 (permalink)  
Antiguo 27/02/2009, 08:30
Avatar de hoberwilly  
Fecha de Ingreso: julio-2008
Ubicación: Lima - Perú
Mensajes: 769
Antigüedad: 9 años, 5 meses
Puntos: 2
Respuesta: Consulta...hipervinculos no subrayados

Estuve leyendo el manual, y encontre unas respuestas que por favor me podrian ayudar:
1. display: block. Textualmente dice: Permite mostrar un elemento como si fuera un elemento de bloque, independientemente del tipo de elemento que se trate.
...a esto no entiendo a que se llaman elementos de bloque (aqui esta creo enterder la respuesta de su funcionalidad???)
2. porque la anchura al 100%???? (width), idem para el height.
3. con este line-height (interlineado) estamos al 50% de la respuesta, solo falta la duda del porque 32px...sera por la altura que presenta el <td>???

Gracias de antemano,
  #11 (permalink)  
Antiguo 11/03/2009, 18:02
Avatar de hoberwilly  
Fecha de Ingreso: julio-2008
Ubicación: Lima - Perú
Mensajes: 769
Antigüedad: 9 años, 5 meses
Puntos: 2
Respuesta: Consulta...hipervinculos no subrayados

Hola Mikmoro, recurro de nuevo para pedir por favor me sepan orientar a la siguiente implementación.
Tengo el css, según las sugerencias arriba mencionadas:
Código php:
Ver original
  1. <!-- <style type="text/css">
  2. <!--
  3. .visita {
  4.     font-family:  Arial;
  5.     font-size: 13px;
  6.     font-weight: semi-bold;
  7.     color: blue;
  8.     background-color: "#F2F2F2";
  9. }
  10. .encabezado {
  11.     font-family: Arial;
  12.     font-size: 15px;
  13.     font-weight: bold;
  14.     color: white;
  15.     background-color: #48A4FF;
  16. }
  17. a.menu_izq:link,a.menu_izq:visited{
  18.     font-family: Arial;
  19.     font-size: 12px;
  20.     font-weight: semi-bold;
  21.     color: blue;
  22.     text-decoration: none;
  23.     background-color: "#F2F2F2";
  24. }
  25. a.menu_izq:hover,a.menu_izq:active{
  26.     font-family: Arial;
  27.     font-size: 13px;
  28.     font-weight: semi-bold;
  29.     color: #FF9D3C;
  30.     text-decoration: underline;
  31.     background-color: "#F2F2F2";
  32. }
  33. a.menu_izq{
  34.     display: block;
  35.     width: 100&#37;;
  36.     height: 100%;
  37.     line-height: 65px;
  38.     text-indent: 5px;
  39. }
  40. -->
  41. </style> -->
y este es mi pagina php:
Código php:
Ver original
  1. <!-- <body>
  2. <table width="162" border="0" cellpadding="0" cellspacing="0">
  3. <tr>
  4.     <td colspan="2" height="28" align="center" valign="middle" class="encabezado">Categor&iacute;as</td>
  5. </tr>
  6. <tr>
  7.     <td><img src="img/linea_menu.gif" width="85" height="2"></td>
  8.     <td><img src="img/linea_menu.gif" width="77" height="2"></td>
  9. </tr>
  10. <tr>
  11.     <td valign="middle"><a href="index.php?p=1" class="menu_izq">Para Ellas</a></td>
  12.     <td valign="middle"><a href="index.php?p=1"><img src="fotos/ella.jpg" width="77" height="65" alt="Para Ellas" border="0"></a></td>
  13. </tr>
  14. <tr>
  15.     <td><img src="img/linea_menu.gif" width="85" height="2"></td>
  16.     <td><img src="img/linea_menu.gif" width="77" height="2"></td>
  17. </tr>
  18. </table>
  19. </body> -->
El tema esta en que quisiera consultar si se puede hacer que al momento de pasar el mouse por la imagen el link se active tambien (ojo que esta cuando pasa el mouse sobre el link)...esto es algo como la sgte pagina:
http://www.uwiener.edu.pe/sigunet.aspx

Gracias de antemano por la ayuda,
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 07:38.