<br>: Das Zeilenumbruch-Element

<p>
  O’er all the hilltops<br />
  Is quiet now,<br />
  In all the treetops<br />
  Hearest thou<br />
  Hardly a breath;<br />
  The birds are asleep in the trees:<br />
  Wait, soon like these<br />
  Thou too shalt rest.
</p>

p {
  font-size: 1rem;
  font-family: sans-serif;
  margin: 20px;
}

Wie Sie im obigen Beispiel sehen können, wird ein <br> Element an jeder Stelle eingefügt, an der wir möchten, dass der Text umgebrochen wird. Der Text nach dem <br> beginnt wieder am Anfang der nächsten Zeile des Textblocks.

Die Attribute dieses Elements umfassen die globalen Attribute.

clear Veraltet

Gibt an, wo die nächste Zeile nach dem Umbruch beginnen soll.

Das <br> Element hat einen einzigen, gut definierten Zweck — es erzeugt einen Zeilenumbruch in einem Textblock. Daher hat es keine eigenen Abmessungen oder visuelle Ausgabe, und es gibt sehr wenig, was Sie daran gestalten können.

Sie können auf <br> Elementen selbst ein margin setzen, um den Abstand zwischen den Textzeilen im Block zu vergrößern, aber dies ist eine schlechte Praxis — Sie sollten die line-height-Eigenschaft verwenden, die dafür ausgelegt ist.

Das Erstellen separater Textabsätze mit <br> ist nicht nur eine schlechte Praxis, es ist problematisch für Personen, die mit Hilfe von Bildschirmlesetechnologie navigieren. Bildschirmlesegeräte können das Vorhandensein des Elements ankündigen, jedoch nicht den Inhalt innerhalb von <br>s. Dies kann eine verwirrende und frustrierende Erfahrung für die Person darstellen, die den Bildschirmleser verwendet.

Verwenden Sie <p> Elemente und verwenden Sie CSS-Eigenschaften wie margin, um deren Abstände zu steuern.

Im folgenden Beispiel verwenden wir <br> Elemente, um Zeilenumbrüche zwischen den verschiedenen Zeilen einer Postadresse zu erzeugen:

Mozilla<br />
331 E. Evelyn Avenue<br />
Mountain View, CA<br />
94041<br />
USA<br />

Ergebnis

• <address> Element
• <p> Element
• <wbr> Element