<wbr>: Das Zeilenumbruch-Möglichkeiten-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 <wbr>-HTML Element repräsentiert eine Worttrennungsmöglichkeit – eine Position innerhalb eines Textes, an der der Browser optional eine Zeile umbrechen kann, obwohl seine Zeilenumbruchregeln an dieser Stelle normalerweise keinen Umbruch vornehmen würden.

Probieren Sie es aus

<div id="example-paragraphs"> <p>Fernstraßenbauprivatfinanzierungsgesetz</p> <p>Fernstraßen<wbr />bau<wbr />privat<wbr />finanzierungs<wbr />gesetz</p> <p>Fernstraßen&shy;bau&shy;privat&shy;finanzierungs&shy;gesetz</p> </div>

#example-paragraphs { background-color: white; overflow: hidden; resize: horizontal; width: 9rem; border: 2px dashed #999; }

Attribute

Dieses Element umfasst nur die globalen Attribute.

Hinweise

Auf UTF-8-kodierten Seiten verhält sich <wbr> wie der U+200B ZERO-WIDTH SPACE-Codepunkt. Insbesondere verhält es sich wie ein Unicode-Bidi-BN-Codepunkt, was bedeutet, dass es keinen Einfluss auf die bidi-Anordnung hat: <div dir=rtl>123,<wbr>456</div> zeigt, wenn nicht in zwei Zeilen gebrochen, 123,456 und nicht 456,123.

Aus dem gleichen Grund fügt das <wbr>-Element keinen Bindestrich an der Zeilenumbruchsposition ein. Um einen Bindestrich nur am Ende einer Zeile erscheinen zu lassen, verwenden Sie stattdessen das Weichbindestrich-Zeichen-Entity ().

Beispiele

Der Yahoo Style Guide empfiehlt, eine URL vor einem Satzzeichen zu trennen, um zu vermeiden, dass am Ende der Zeile ein Satzzeichen stehen bleibt, welches der Leser möglicherweise für das Ende der URL hält.

html

<p> http://this<wbr />.is<wbr />.a<wbr />.really<wbr />.long<wbr />.example<wbr />.com/With<wbr />/deeper<wbr />/level<wbr />/pages<wbr />/deeper<wbr />/level<wbr />/pages<wbr />/deeper<wbr />/level<wbr />/pages<wbr />/deeper<wbr />/level<wbr />/pages<wbr />/deeper<wbr />/level<wbr />/pages </p>

Ergebnis

Technische Zusammenfassung

Inhaltskategorien	Flussinhalt, eingerichteter Inhalt.
Erlaubter Inhalt	Leer
Tag-Weglassen	Muss ein Start-Tag haben und darf keinen End-Tag haben.
Erlaubte Eltern	Jedes Element, das eingerichteten Inhalt akzeptiert.
Implizierte ARIA-Rolle	Keine entsprechende Rolle
Erlaubte ARIA-Rollen	Beliebig
DOM-Schnittstelle	[`HTMLElement`](/de/docs/Web/API/HTMLElement)

Spezifikationen

Specification
HTML # the-wbr-element