W3docs
fr
Se connecter

Propriété CSS text-decoration-skip-ink

Use the CSS text-decoration-skip-ink property to specify how underlines and overlines should be drawn. See property values and try examples.

La propriété text-decoration-skip-ink spécifie comment les soulignements et les surlignements sont tracés lorsqu'ils croisent un glyphe.

info

Lorsque la text-decoration-line propriété est définie sur "underline" et "overline", la propriété text-decoration-skip-ink a un effet. La valeur "Line-through" n'est pas affectée.

Valeur initialeauto
S'applique àTous les éléments.
HéritéeOui.
AnimableNon.
VersionCSS Text Decoration Module Level 4
Syntaxe DOMobject.style.textDecorationSkipInk = "none";

Syntaxe

Valeurs CSS text-decoration-skip-ink

text-decoration-skip-ink: auto | none | initial | inherit;

Exemple de la propriété text-decoration-skip-ink :

Exemple de code CSS text-decoration-skip-ink

<!DOCTYPE html>
<html>
  <head>
    <title>Title of the document</title>
    <style>
      .ex1 {
        margin: 0;
        font-size: 2em;
        text-decoration: underline #1c87c9;
        text-decoration-skip-ink: none;
      }
      .ex2 {
        margin: 0;
        font-size: 2em;
        text-decoration: underline #1c87c9;
        text-decoration-skip-ink: auto;
      }
    </style>
  </head>
  <body>
    <h2>
        Text-decoration-skip-ink property example
    </h2>
    <h3>
        Text-decoration-skip-ink: none;
    </h3>
    <p class="ex1">
      Lorem ipsum is simply dummy text
    </p>
    <h3>
        Text-decoration-skip-ink:auto;
    </h3>
    <p class="ex2">
      Lorem ipsum is simply dummy text
    </p>
  </body>
</html>
Essayez vous-même »

Résultat

Liste des valeurs CSS text-decoration-skip-ink

Valeurs

ValeurDescription
autoLes soulignements et les surlignements ne sont tracés que là où ils ne touchent pas ou ne s'approchent pas de près d'un glyphe. Il s'agit de la valeur par défaut de cette propriété.
noneLes soulignements et les surlignements sont tracés pour tout le contenu textuel, y compris les parties qui croisent les descentes et montées des glyphes.
initialDéfinit la propriété sur sa valeur par défaut.
inheritHérite la propriété de son élément parent.

Practice

Pratique

Que fait la propriété CSS 'text-decoration-skip-ink' ?