<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.
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
.sold-out {
text-decoration: line-through;
}
<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-lineEigenschaft sollte verwendet werden, um den früheren visuellen Aspekt des<s>-Elements zu erreichen.