Saltar al contenido

Propiedad CSS text-decoration-skip

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 inicialnone
Se aplica aTodos los elementos.
HeredableSí.
AnimableNo.
VersiónBorrador (Obsoleto)
Sintaxis DOMobject.style.textDecorationSkip = "spaces";

Sintaxis

Valores de CSS text-decoration-skip

css
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

html
<!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>

Resultado

Lista de valores de CSS text-decoration-skip

nota

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

Valores

ValorDescripción
noneNo se omitirá nada. Por lo tanto, la decoración de texto se dibuja para todo el contenido de texto.
objectsOmite las decoraciones sobre elementos reemplazados (como imágenes) o cajas inline-block.
spacesSe omiten todos los espacios.
leading spacesSe omiten los espacios iniciales (unidades de caracteres tipográficos, separadores de palabras, letter-spacing o word-spacing).
trailing spacesSe omiten los espacios finales (unidades de caracteres tipográficos, separadores de palabras, letter-spacing o word-spacing).
edgesEl inicio y el final de la decoración de texto se insertan ligeramente desde el borde del contenido de la caja decorativa.
box-decorationSe omiten las áreas de margen, borde y relleno de la caja.

Compatibilidad con navegadores

NavegadorSoporte
ChromeNunca implementado
FirefoxNunca implementado
SafariNunca implementado
EdgeNunca implementado
OperaNunca implementado

Práctica

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

¿Te resulta útil?

Vista previa dual-run — compárala con las rutas Symfony en producción.