Quitar el subrayado de los enlaces en HTML/CSS

Julio 2016


Por defecto, los enlaces de hipertextos en HTML son subrayados mediante una raya de color que aparece debajo del texto. Es posible suprimir este subrayado con la ayuda de la propiedad CSS text-decoration:none

Gracias al CSS


Para hacer esto basta definir el código CSS siguiente en su código HTML:
<style type="text/css">   
a:link   
{   
 text-decoration:none;   
}   
</style>


Nota: La pseudo-clase :link permite enfocarse sólo en los enlaces de hipertextos (<a href="">) y no en los atributos (<a name="">). Sin embargo, puedes hacerlo si lo deseas.

Gracias al CSS mediante una clase


Si deseas que este estilo se aplique sólo a ciertos enlaces, te basta por ejemplo con definir una clase específica para los enlaces no subrayados (por ejemplo la clase nounderline):
<style type="text/css">   
a.nounderline:link   
{   
 text-decoration:none;   
}   
</style>


Luego, al escribir el enlace, hacer referencia a esta clase:

<a href="/" class="nounderline">Texto del enlace</a>

Gracias al CSS en línea


Si no deseas definir la "hoja de estilo", puedes simplemente definir el estilo en línea con la ayuda del atributo estilo de la manera siguiente:

<a href="/" style="text-decoration:none">Texto del enlace</a>

Consulta también :
El documento «Quitar el subrayado de los enlaces en HTML/CSS» de CCM (es.ccm.net) se encuentra disponible bajo una licencia Creative Commons. Puedes copiarlo o modificarlo siempre y cuando respetes las condiciones de dicha licencia y des crédito a CCM.