text-decoration

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020.

Das text-decoration Attribut definiert, ob der Text mit einer Unterstreichung, Überstreichung und/oder Durchstreichung versehen ist. Es ist eine Kurzform für die Eigenschaften text-decoration-line und text-decoration-style.

Das Füllen und Streichen der Textdekoration wird durch das Füllen und Streichen des Textes an dem Punkt bestimmt, an dem die Textdekoration deklariert wird.

Die Malreihenfolge der Textdekoration, d.h. das Füllen und Streichen, wird durch den Wert des paint-order Attributs an dem Punkt bestimmt, an dem die Textdekoration deklariert wird.

Hinweis: Als Präsentationsattribut hat text-decoration auch ein entsprechendes CSS-Eigenschafts-Pendant: text-decoration. Wenn beide angegeben sind, hat die CSS-Eigenschaft Vorrang.

Sie können dieses Attribut mit den folgenden SVG-Elementen verwenden:

Beispiel

html,
body,
svg {
  height: 100%;
}

html

<svg viewBox="0 0 250 50" xmlns="http://www.w3.org/2000/svg">
  <text y="20" text-decoration="underline">Underlined text</text>
  <text x="0" y="40" text-decoration="line-through">Struck-through text</text>
</svg>

Verwendungshinweise

Wert	`<'text-decoration-line'>` \|\| `<'text-decoration-style'>` \|\| `<'text-decoration-color'>`
Standardwert	Siehe einzelne Eigenschaften
Animierbar	Ja

Für eine Beschreibung der Werte lesen Sie bitte die CSS text-decoration Eigenschaft.

Spezifikationen

Specification
CSS Text Decoration Module Level 3 # text-decoration-property
Scalable Vector Graphics (SVG) 2 # TextDecorationProperties

Browser-Kompatibilität

Siehe auch

CSS text-decoration Eigenschaft