<s>: Das Durchstreichungselement

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 von HTML stellt Text mit einer Durchstreichung dar, oder anders gesagt einem Strich hindurch. Verwenden Sie das <s>-Element, um Dinge darzustellen, die nicht mehr relevant oder nicht mehr korrekt sind. <s> ist jedoch nicht geeignet, um Dokumentänderungen anzuzeigen; dafür sollten die <del>- und <ins>-Elemente wie passend verwendet werden.

Probieren Sie es aus

<p><s>There will be a few tickets available at the box office tonight.</s></p>

<p>SOLD OUT!</p>

s {
  /* Add your styles here */
}

Attribute

Dieses Element umfasst nur die globalen Attribute.

Barrierefreiheit

Die Anwesenheit des s-Elements wird von den meisten Screenreader-Technologien in ihrer Standardkonfiguration nicht angekündigt. Es kann jedoch durch die Verwendung der CSS-content-Eigenschaft zusammen mit den Pseudo-Elementen ::before und ::after angekündigt werden.

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 Personen, die Screenreader verwenden, deaktivieren bewusst die Ankündigung von Inhalten, die zusätzliche Wortfülle schaffen. Daher ist es wichtig, diese Technik nicht zu missbrauchen und sie nur in Situationen anzuwenden, in denen das Nichtwissen, dass Inhalte durchgestrichen wurden, das Verständnis nachteilig beeinflussen würde.

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	Phrasierungsinhalt, Flussinhalt.
Erlaubter Inhalt	Phrasierungsinhalt.
Tag-Auslassung	Keine, sowohl das Start- als auch das End-Tag sind zwingend erforderlich.
Erlaubte Eltern	Jedes Element, das Phrasierungsinhalt akzeptiert.
Implizite ARIA-Rolle	`deletion`
Erlaubte ARIA-Rollen	Beliebig
DOM-Schnittstelle	[`HTMLElement`](/de/docs/Web/API/HTMLElement)

Spezifikationen

Specification
HTML # the-s-element

Browser-Kompatibilität

Siehe auch

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