Das<wbr>HTML-Element repräsentiert eine Worttrennungsmöglichkeit – eine Position innerhalb des Textes, an der der Browser optional eine Zeilenumbruch einfügen kann, obwohl nach den normalen Zeilenumbruchregeln dort kein Umbruch erfolgen würde.

Probieren Sie es aus

<div>  <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 #999999;}

Attribute

Dieses Element enthält nur dieglobalen Attribute.

Hinweise

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

Aus demselben Grund führt das<wbr>-Element auch keinen Bindestrich an der Zeilenumbruchstelle ein. Um einen Bindestrich nur am Ende einer Zeile erscheinen zu lassen, verwenden Sie stattdessen das weiche Bindestrichzeichen-Entity (­).

Beispiele

DerYahoo Style Guide empfiehlt,einen URLvor einem Satzzeichen zu brechen, um zu vermeiden, dass ein Satzzeichen am Ende der Zeile steht, das vom Leser als Ende der URL missverstanden werden könnte.

<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

Spezifikationen

Browser-Kompatibilität

Siehe auch

• overflow-wrap
• word-break
• hyphens
• Das<br>-Element