<s>: Das Strikethrough-Element

Baseline Widely available

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

Das <s>-Element HTML rendert Text mit einem Strikethrough oder einem Durchstrich. Verwenden Sie das <s>-Element, um Dinge darzustellen, die nicht mehr relevant oder nicht mehr korrekt sind. Das <s>-Element ist jedoch nicht geeignet, um Dokumentänderungen anzuzeigen; für diesen Zweck verwenden Sie die <del>- und <ins>-Elemente entsprechend.

Probieren Sie es aus

Attribute

Dieses Element enthält nur die globalen Attribute.

Barrierefreiheit

Das Vorhandensein des s-Elements wird von den meisten Screenreader-Technologien in ihrer Standardeinstellung nicht angekündigt. Es kann so konfiguriert werden, dass es angekündigt wird, indem die CSS-Eigenschaft content, zusammen mit den Pseudoelementen ::before und ::after, verwendet wird.

css
s::before,
s::after {
  clip-path: inset(100%);
  clip: rect(1px, 1px, 1px, 1px);
  height: 1px;
  overflow: hidden;
  position: absolute;
  white-space: nowrap;
  width: 1px;
}

s::before {
  content: " [start of stricken text] ";
}

s::after {
  content: " [end of stricken text] ";
}

Einige Nutzer von Screenreadern deaktivieren bewusst die Ankündigung von Inhalten, die zusätzliche Redundanz schaffen. Aus diesem Grund ist es wichtig, diese Technik nicht übermäßig zu verwenden und sie nur in Situationen anzuwenden, in denen es das Verständnis beeinträchtigen würde, wenn der durchgestrichene Inhalt nicht bekannt ist.

Beispiele

css
.sold-out {
  text-decoration: line-through;
}
html
<s>Today's Special: Salmon</s> SOLD OUT<br />
<span class="sold-out">Today's Special: Salmon</span> SOLD OUT

Ergebnis

Technische Zusammenfassung

Inhaltskategorien Text-Inhalt, Flussinhalt.
Erlaubter Inhalt Text-Inhalt.
Tag-Auslassung Keine, sowohl das Start- als auch das End-Tag sind obligatorisch.
Erlaubte Eltern Jedes Element, das Text-Inhalt akzeptiert.
Implizite ARIA-Rolle deletion
Erlaubte ARIA-Rollen Jede
DOM-Schnittstelle [`HTMLElement`](/de/docs/Web/API/HTMLElement)

Spezifikationen

Specification
HTML Standard
# the-s-element

Browser-Kompatibilität

BCD tables only load in the browser

Siehe auch

  • Das <strike>-Element, das alter Ego des <s>-Elements, ist veraltet und sollte nicht mehr auf Webseiten verwendet werden.
  • Verwenden Sie das <del>-Element, wenn Daten gelöscht wurden.
  • Die CSS-Eigenschaft text-decoration-line sollte verwendet werden, um den ehemaligen visuellen Aspekt des <s>-Elements zu erreichen.