<wbr>: Das Zeilenumbruch-Möglichkeitselement

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 stellt eine Wortumbruchmöglichkeit dar—eine Position innerhalb des Textes, an der der Browser optional einen Zeilenumbruch einfügen kann, obwohl seine Zeilenumbruchregeln an dieser Stelle normalerweise keinen Umbruch erzeugen 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 enthält 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 keine Auswirkungen auf die bidi-Reihenfolge hat: <div dir=rtl>123,<wbr>456</div> wird, wenn nicht auf zwei Zeilen gebrochen, als 123,456 angezeigt und nicht als 456,123.

Aus demselben Grund führt das <wbr> Element keinen Bindestrich am Zeilenumbruchpunkt ein. Um einen Bindestrich nur am Ende einer Zeile erscheinen zu lassen, verwenden Sie stattdessen die weiche Bindestrich-Zeichenentität ().

Beispiele

Der Yahoo Style Guide empfiehlt, einen URL vor einem Satzzeichen zu brechen, um zu vermeiden, dass am Ende der Zeile ein Satzzeichen bleibt, das 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, Phrasierungsinhalt.
Erlaubter Inhalt	Leer
Tag-Auslassung	Muss ein Start-Tag haben und darf keinen End-Tag haben.
Erlaubte Eltern	Jedes Element, das Phrasierungsinhalt 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