Cómo quitar subrayado en enlaces.
Definimos una clase personalizada: .enlace, así:
.enlaces { FONT-SIZE: 11px; COLOR: #003399; FONT-FAMILY: Arial; TEXT-DECORATION: none }
y que alicaríamos a los enlaces de la siguiente manera:
<A class="enlaces" HREF="pagina_de_destino.htm">texto</A>
En la definición del estilo, veréis que utilizamos la siguiente declaración:
TEXT-DECORATION: none
Esto quitó el subrayado de los enlaces. La norma a:hover usa la pseudo-clase "hover" para cambiar la apariencia de nuestro enlace cuando el ratón lo "sobrevuela".,Si utilizamos la declaración:
TEXT-DECORATION: underline
No cambiaría el color ni haría nada más, simplemente conseguir que aparezca el subrayado al poner el ratón en encima.
Hay varias pseudo-clases en la especificación CSS1, pero las más conocidas son las relacionadas con la etiqueta <A> y que son las que se utilizan para los efectos generales de los enlaces:
a:link { color: red } /* un enlace no visitado*/
A:visited { color: blue } /* enlace visitado */
A:hover { color: black } /* raton encima */
A:active { color: lime } /* enlace activo */
la pseudo-clase A.hover (ratón encima del enlace) fue añadida en la especificación CSS2 (y por ello Netscape 4.x no la soporta). Tened cuidado al utilizar la característica de no subrayar los enlaces y no abusad de ella, ya que la gente sigue esperando encontrar sus enlaces con subrayado. Podría suceder que ni siquiera adivinara que es un enlace.
Usuarios que han visto este tema también han visto...
- Mejorando la apariencia de los formularios utilizando hojas de estilo
- Diseño de menús con CSS avanzado
- Separar HTML de CSS.
- Efecto zoom de imagen utilizando solo CSS
- Barra de navegación en CSS
Información legal | Política de Privacidad | Contacte con nosotros
Otro proyecto de Factoría de Internet. Copyright© 2003-2008 Factoría de Internet S.L.. Todos los derechos reservados.