Quitar el subrayado de los enlaces en HTML/CSS

Mayo 2017


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

Artículo original escrito por . Traducido por Carlos-vialfa. Última actualización: 2 de mayo de 2013 a las 20:36 por Carlos-vialfa.
El documento «Quitar el subrayado de los enlaces en HTML/CSS» se encuentra disponible bajo una licencia Creative Commons. Puedes copiarlo o modificarlo libremente. No olvides citar a CCM (es.ccm.net) como tu fuente de información.