Resumen

La propiedad CSS text-decoration-line establece el tipo de decoración de línea que se agregará a un elemento.

La decoración underline posiciona el subrayado debajo del texto, la decoración overline posiciona el subrayado encima del texto, y la decoración line-through posiciona la línea en medio del texto.

Valor inicialnone
Applies toall elements. It also applies to ::first-letter and ::first-line.
Heredableno
Mediavisual
Valor calculadocomo se especifica
Animation typediscrete
Canonical orderorder of appearance in the formal grammar of the values

Sintaxis

/* Valores de clave */
text-decoration-line: none;
text-decoration-line: underline;
text-decoration-line: overline;
text-decoration-line: line-through;
text-decoration-line: underline overline;                /* Dos líneas de decoración */
text-decoration-line: overline underline line-through;   /* Múltiples líneas de decoración */

/* Valores globales */
text-decoration-line: inherit;
text-decoration-line: initial;
text-decoration-line: unset;

Valores

Acepta none (ninguno), o uno o más valores, separados por espacio:

none
No agrega decoración al texto.
underline
Cada línea del texto lleva subrayado inferior.
overline
Cada línea del texto lleva subrayado superior.
line-through
Cada línea del texto lleva una línea atravesando por en medio del mismo.
blink
El texto parpadea (se alterna entre visible e invisible). Según los ajustes del agente usuario, el texto puede simplemente no parpadear. Este valor está en desuso, en favor de las Animaciones.
-moz-anchor-decoration
El texto es decorado con el estilo de un ancla; no adecuado para contenido web.

Sintaxis formal

none | [ underline || overline || line-through || blink ]

Ejemplo

Contenido HTML

<p>¡Aquí hay texto con subrayado inferior rojo ondulado!</p>

Contenido CSS

p { 
  text-decoration-line: underline;
  text-decoration-style: wavy;
  text-decoration-color: red;
}

Especificaciones

Especificación Estado Comentarios
CSS Text Decoration Module Level 3
La definición de 'text-decoration-line' en esta especificación.
Candidate Recommendation Definición inicial. La propiedad text-decoration no era una forma reducida anteriormente.

Compatibilidad de navegadores

We're converting our compatibility data into a machine-readable JSON format. This compatibility table still uses the old format, because we haven't yet converted the data it contains. Find out how you can help!

Característica Chrome Firefox (Gecko) Internet Explorer Opera Safari
Soporte básico Sin soporte 6.0 (6.0) -moz[1]
36.0 (36.0)
Sin soporte Sin soporte 7.1 -webkit
blink Sin soporte 26.0 (26.0)[2] Sin soporte Sin soporte ?
Característica Android Chrome for Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Soporte básico Sin soporte Sin soporte[3] 6.0 (6.0) -moz[1]
36.0 (36.0)
Sin soporte Sin soporte 8 -webkit
blink Sin soporte Sin soporte 26.0 (26.0)[2] Sin soporte Sin soporte ?

[1] La versión con prefijo fue removida en Gecko 39.0 (Firefox 39.0 / Thunderbird 39.0 / SeaMonkey 2.36).

[2] El valor es considerado válido, pero no se muestra el parpadeo, puesto que la especificación permite que el agente usuario lo ignore.

[3] Véase WebKit bug 90959.

Etiquetas y colaboradores del documento

Etiquetas: 
 Colaboradores en esta página: israel-munoz
 Última actualización por: israel-munoz,