Dieser Inhalt wurde automatisch aus dem Englischen übersetzt, und kann Fehler enthalten. Erfahre mehr über dieses Experiment.

View in English Always switch to English

<s> HTML-Durchstreichungs-Element

Baseline Weitgehend verfügbar

Diese Funktion ist gut etabliert und funktioniert auf vielen Geräten und in vielen Browserversionen. Sie ist seit Juli 2015 browserübergreifend verfügbar.

Das <s> HTML-Element rendert Text mit einem Durchstrich oder einer Linie durch den Text. Verwenden Sie das <s>-Element, um Dinge darzustellen, die nicht mehr relevant oder genau sind. Das <s>-Element eignet sich jedoch nicht, um Dokumentänderungen anzuzeigen; dafür verwenden Sie die <del> und <ins> Elemente, wie entsprechend notwendig.

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.

Zugänglichkeit

Die Anwesenheit des s-Elements wird in der Standardkonfiguration von den meisten Screen-Reader-Technologien nicht angekündigt. Es kann mittels der CSS content-Eigenschaft in Kombination mit den ::before und ::after Pseudo-Elementen 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 Screen-Reader verwenden, deaktivieren absichtlich das Ankündigen von Inhalten, die zusätzliche Ausführlichkeit erzeugen. Aus diesem Grund ist es wichtig, diese Technik nicht zu missbrauchen und sie nur in Situationen anzuwenden, in denen die Kenntnis des durchgestrichenen Inhalts essentiell für das Verständnis 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 Phrasing-Inhalt, Flow-Inhalt.
Erlaubter Inhalt Phrasing-Inhalt.
Tag-Auslassung Keine, sowohl das startende als auch das endende Tag sind erforderlich.
Erlaubte Eltern-Elemente Jedes Element, das Phrasing-Inhalt akzeptiert.
Implizite ARIA-Rolle deletion
Erlaubte ARIA-Rollen Jede
DOM-Schnittstelle [`HTMLElement`](/de/docs/Web/API/HTMLElement)

Spezifikationen

Spezifikation
HTML
# the-s-element

Browser-Kompatibilität

Siehe auch

  • Das <strike> Element, das Gegenstück zum <s>-Element, ist veraltet und sollte nicht mehr auf Webseiten verwendet werden.
  • Das <del> Element sollte 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.