W3docs
de
Anmelden

CSS text-decoration-skip-ink-Eigenschaft

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

Die Eigenschaft text-decoration-skip-ink legt fest, wie Unter- und Überstriche gezeichnet werden, wenn sie über ein Glyph (Zeichen) verlaufen.

info

Wenn die text-decoration-line Eigenschaft auf „underline“ und „overline“ gesetzt ist, hat die Eigenschaft text-decoration-skip-ink eine Wirkung. Der Wert „line-through“ bleibt unverändert.

Anfangswertauto
Anwendbar aufAlle Elemente.
VererbbarJa.
AnimierbarNein.
VersionCSS Text Decoration Module Level 4
DOM-Syntaxobject.style.textDecorationSkipInk = "none";

Syntax

CSS text-decoration-skip-ink Werte

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

Beispiel für die text-decoration-skip-ink-Eigenschaft:

CSS text-decoration-skip-ink Codebeispiel

<!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>
Probier es selbst »

Ergebnis

Liste der CSS text-decoration-skip-ink Werte

Werte

WertBeschreibung
autoUnter- und Überstriche werden nur dort gezeichnet, wo sie kein Glyph berühren oder sich ihm nicht nähern. Dies ist der Standardwert dieser Eigenschaft.
noneUnter- und Überstriche werden für den gesamten Textinhalt gezeichnet, einschließlich der Teile, die über die Unterlängen und Oberlängen der Glyphen verlaufen.
initialLegt die Eigenschaft auf ihren Standardwert fest.
inheritErbt die Eigenschaft von ihrem übergeordneten Element.

Praxis

Übung

Welche Funktion hat die CSS-Eigenschaft 'text-decoration-skip-ink'?