CSS text-decoration-skip-Eigenschaft

Die CSS-Eigenschaft text-decoration-skip legt fest, welche Teile des Inhalts eines Elements von der Textdekoration übersprungen werden sollen.

Sie steuert alle Textdekoration-Linien, die vom Element und seinen Vorfahren gezeichnet werden. Im Gegensatz zu text-decoration-skip-ink, das sich nur auf Tinte auswirkt, die Text überlappt, versuchte diese Eigenschaft, Dekorationen über Leerzeichen und ersetzte Elemente zu überspringen, wurde jedoch letztendlich aus der Spezifikation entfernt.

Warnung
Der Wert „ink“ wurde zur Eigenschaft text-decoration-skip-ink verschoben.

Hinweis
Diese Eigenschaft ist veraltet und wird nur noch sehr eingeschränkt von Browsern unterstützt. Erwägen Sie stattdessen die Verwendung von text-decoration-skip-ink.

Anfangswert	none
Gilt für	Alle Elemente.
Vererbbar	Ja.
Animierbar	Nein.
Version	Entwurf (Veraltet)
DOM-Syntax	object.style.textDecorationSkip = "spaces";

Syntax

CSS text-decoration-skip-Werte

css

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

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

CSS text-decoration-skip-Codebeispiel

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>

Try it Yourself »

Ergebnis

CSS text-decoration-skip-Werteliste

Hinweis
Diese Eigenschaft ist veraltet und wird in modernen Browsern nicht unterstützt. Das Beispiel zeigt keine visuellen Änderungen.

Werte

Wert	Beschreibung
none	Kein Überspringen. Die Textdekoration wird also für den gesamten Textinhalt gezeichnet.
objects	Überspringt Dekorationen über ersetzte Elemente (wie Bilder) oder Inline-Block-Boxen.
spaces	Alle Leerzeichen werden übersprungen.
leading spaces	Führende Leerzeichen werden übersprungen (typografische Zeicheneinheiten, Worttrennzeichen, Buchstaben- oder Wortabstand).
trailing spaces	Nachfolgende Leerzeichen werden übersprungen (typografische Zeicheneinheiten, Worttrennzeichen, Buchstaben- oder Wortabstand).
edges	Anfang und Ende der Textdekoration werden leicht vom Inhaltsrand der Dekurationsbox zurückgesetzt.
box-decoration	Die Außenabstands-, Rahmen- und Innenabstandsbereiche der Box werden übersprungen.

Browserkompatibilität

Browser	Unterstützung
Chrome	Nie implementiert
Firefox	Nie implementiert
Safari	Nie implementiert
Edge	Nie implementiert
Opera	Nie implementiert

Praxis

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

Sie legt fest, ob die Dekorationlinien über oder unter dem Text unterbrochen werden sollen.Sie legt fest, ob und wie eine Textdekorationlinie durch den Text selbst gezeichnet wird.Sie legt fest, welche Teile der Content-Box eines Elements von den Dekorationlinien gezeichnet werden; sie wird hauptsächlich verwendet, um 'none', 'objects', 'spaces', 'ink', 'edges', 'box-decoration' und 'leading-spaces' festzulegen.Sie legt fest, wie der Text in Zeilen umgebrochen wird.Sie steuert den Versatz des Schattens vom Text.Sie legt fest, ob und wie die Textdekorationlinie über 'none', 'objects', 'spaces', 'ink', 'edges', 'box-decoration' und 'leading-spaces' überspringt.

CSS text-decoration-skip-Eigenschaft ​

Syntax ​

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

Ergebnis ​

Werte ​

Browserkompatibilität ​