CSS text-decoration-skip Property

La propiedad text-decoration-skip especifica las partes del contenido de un elemento que la decoración de texto debe omitir.

Controla todas las líneas de decoración de texto dibujadas por el elemento y por sus ancestros. A diferencia de text-decoration-skip-ink, que solo apunta a la tinta que se superpone al texto, esta propiedad intentó omitir las decoraciones sobre espacios en blanco y elementos reemplazados, pero finalmente fue eliminada de la especificación.

peligro

El valor "ink" se movió a la propiedad text-decoration-skip-ink.

nota

Esta propiedad está obsoleta y tiene un soporte muy limitado en los navegadores. Considere usar text-decoration-skip-ink en su lugar.

Valor inicial	none
Se aplica a	Todos los elementos.
Heredable	Sí.
Animable	No.
Versión	Borrador (Obsoleto)
Sintaxis DOM	object.style.textDecorationSkip = "spaces";

Sintaxis

Valores de CSS text-decoration-skip

text-decoration-skip: none | objects | spaces | leading spaces | trailing spaces | edges | box-decoration;

Ejemplo de la propiedad text-decoration-skip:

Ejemplo de código CSS text-decoration-skip

<!DOCTYPE html>
<html>
  <head>
    <title>Title of the document</title>
    <style>
      p {
        margin: 1em;
        color: #ccc;
        font-size: 2em;
        text-decoration: underline;
        text-decoration-skip: edges;
      }
    </style>
  </head>
  <body>
    <h2>Text-decoration-skip property example</h2>
    <p>
      <em>Lorem,</em>
      <em>ipsum is simply dummy text</em>
    </p>
  </body>
</html>

Pruébalo tú mismo »

Resultado

nota

Esta propiedad está obsoleta y no es compatible con los navegadores modernos. El ejemplo no mostrará ningún cambio visual.

Valores

Valor	Descripción
none	No se omitirá nada. Por lo tanto, la decoración de texto se dibuja para todo el contenido de texto.
objects	Omite las decoraciones sobre elementos reemplazados (como imágenes) o cajas inline-block.
spaces	Se omiten todos los espacios.
leading spaces	Se omiten los espacios iniciales (unidades de caracteres tipográficos, separadores de palabras, letter-spacing o word-spacing).
trailing spaces	Se omiten los espacios finales (unidades de caracteres tipográficos, separadores de palabras, letter-spacing o word-spacing).
edges	El inicio y el final de la decoración de texto se insertan ligeramente desde el borde del contenido de la caja decorativa.
box-decoration	Se omiten las áreas de margen, borde y relleno de la caja.

Compatibilidad con navegadores

Navegador	Soporte
Chrome	Nunca implementado
Firefox	Nunca implementado
Safari	Nunca implementado
Edge	Nunca implementado
Opera	Nunca implementado

Práctica

¿Qué hace la propiedad 'text-decoration-skip' en CSS?

Especifica si se deben interrumpir las líneas de decoración encima o debajo del texto.
Especifica si y cómo se dibuja una línea de decoración de texto a través del propio texto.
Especifica qué partes del content-box de un elemento se dibujan las líneas de decoración; se usa principalmente para establecer 'none', 'objects', 'spaces', 'ink', 'edges', 'box-decoration' y 'leading-spaces'.
Especifica cómo dividir la línea de texto en varias líneas.
Controla el desplazamiento de la sombra respecto al texto.
Especifica si y cómo la línea de text-decoration-line se omite sobre 'none', 'objects', 'spaces', 'ink', 'edges', 'box-decoration' y 'leading-spaces'.