text-decoration-style

Resumen

La propiedad CSS text-decoration-style define el estilo de las líneas especificadas por text-decoration-line. El estilo aplica a todas las líneas, no hay manera de establecer diferentes estilos para cada línea definida por text-decoration-line.

Si la decoración especificada tiene un significado semántico propio, como line-through, que significa que el texto ha sido removido, se recomienda a los autores denotar este significado usando una etiqueta HTML, como <del> o <s>. Siendo que los navegadores pueden deshabilitar estilos en algunos casos, el significado semántico no desaparecerá en dicha situación.

Valor inicialsolid
Applies toall elements. It also applies to ::first-letter and ::first-line.
Heredableno
Mediavisual
Valor calculadocomo se especifica
Animatableno
Canonical orderel orden único no-ambigüo definido por la gramática formal

Sintaxis

/* Valores clave */
text-decoration-style: solid;
text-decoration-style: double;
text-decoration-style: dotted;
text-decoration-style: dashed;
text-decoration-style: wavy;

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

Valores

solid double dotted dashed wavy
Es una de las siguientes palabras clave:
Palabra clave Descripción Comentario
solid Dibuja una línea simple  
double Dibuja una línea doble  
dotted Dibuja una línea punteada  
dashed Dibuja una línea discontinua  
wavy Dibuja una línea ondulada  
-moz-none No dibuja una línea No usarse: usar text-decoration-line: none en su lugar
inherit
Es una palabra clave que indica que se reutilice el valor calculado del elemento padre.

Sintaxis formal

solid | double | dotted | dashed | wavy

Ejemplos

.example { 
    text-decoration-line: underline;
    text-decoration-style: wavy;
    text-decoration-color: red;
}
<p class="example">Así se ve el resultado.</p>

Especificaciones

Especificación Estado Comentarios
CSS Text Decoration Level 3
The definition of 'text-decoration-style' in that specification.
Candidate Recommendation Definición inicial. La propiedad text-decoration no era una forma reducida anteriormente.

Compatibilidad de navegadores

Característica Firefox (Gecko) Chrome Internet Explorer Opera Safari
Soporte básico 6.0 (6.0) - 39.0 (39.0)-moz
36.0 (36.0)
No support No support No support No support
wavy 6.0 (6.0) No support No support No support No support
Característica Android Chrome for Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Soporte básico No support No support 6.0 (6.0)- 39.0 (39.0)-moz
36.0 (36.0)
No support No support No support
wavy No support No support 6.0 (6.0) No support No support No support

Etiquetas y colaboradores del documento

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