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

La propriété text-decoration-skip-ink spécifie comment les lignes en dessous ou au dessus du texte sont dessinées lorsqu'elles rencontre un glyphe.

Lorsque la propriété text-decoration-line est définie à "underline" et "overline", la propriété text-decoration-skip-ink a un effet. La valeur "line-through" est sans affectation.
Valeur initiale auto
Appliquée à Tous les éléments.
Héritée Oui.
Animable Non.
Version CSS4
Syntaxe DOM object.style.textDecorationSkipInk = "none";

Syntaxe

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

Exemple

<!DOCTYPE html>
<html>
  <head>
    <title>Titre du 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>Exemple de la propriété text-decoration-skip-ink</h2>
    <h3>Text-decoration-skip-ink: none;</h3>
    <p class="ex1">Lorem ipsum est simplement du faux texte</p>
    <h3>Text-decoration-skip-ink:auto;</h3>
    <p class="ex2">Lorem ipsum est simplement du faux texte</p>
  </body>
</html>

Valeurs

Valeur Description
auto Les lignes en dessous ou au dessus du texte ne sont dessinées que s'elles ne touchent pas ou ne s'approchent pas de près d'un glyphe. C'est la valeur initiale de cette propriété.
none Les lignes en dessous ou au dessus du texte sont dessinées pour tous le contenu de texte y compris parties qui traversent des descendeurs et des ascendeurs de glyphes.
initial Fait utiliser la valeur initiale
inherit Hérite la propriété de son élément parent.

Support de Navigateurs

64.0+ 50.0+


Trouvez-vous cela utile?

Articles Associées