<hr> HTML thematischer Wechsel (horizontale Linie) 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 <hr> HTML-Element stellt einen thematischen Wechsel zwischen Absatz-Ebene-Elementen dar: zum Beispiel eine Szenenänderung in einer Geschichte oder ein Themenwechsel innerhalb eines Abschnitts.
Probieren Sie es aus
<p>§1: The first rule of Fight Club is: You do not talk about Fight Club.</p>
<hr />
<p>§2: The second rule of Fight Club is: Always bring cupcakes.</p>
hr {
border: none;
border-top: 3px double #333333;
color: #333333;
overflow: visible;
text-align: center;
height: 5px;
}
hr::after {
background: white;
content: "§";
padding: 0 4px;
position: relative;
top: -13px;
}
Historisch gesehen wurde das <hr>-Element immer als horizontale Linie dargestellt. Obwohl es in visuellen Browsern noch als horizontale Linie angezeigt werden kann, wird dieses Element jetzt in semantischen statt in präsentationellen Begriffen definiert. Wenn Sie also eine horizontale Linie zeichnen möchten, sollten Sie dies tun, indem Sie mit CSS eine Grenze zu einem vorhandenen Element hinzufügen.
Die border-*-Eigenschaften (zum Beispiel border-style und border-color) erlauben es Ihnen, das Erscheinungsbild einer Linie deutlich anzupassen, egal ob Sie ein <hr>-Element oder eine auf einem anderen Element gezeichnete Grenze anpassen.
Attribute
Die Attribute dieses Elements umfassen die globalen Attribute.
align-
Setzt die Ausrichtung der Linie auf der Seite. Wenn kein Wert angegeben ist, ist der Standardwert
left. color-
Setzt die Farbe der Linie durch den Farbnamen oder den hexadezimalen Wert.
noshade-
Setzt die Linie so, dass sie keine Schattierung hat.
size-
Setzt die Höhe der Linie in Pixeln.
width-
Setzt die Länge der Linie auf der Seite durch einen Pixel- oder Prozentwert.
Beispiel
HTML
<p>
This is the first paragraph of text. This is the first paragraph of text. This
is the first paragraph of text. This is the first paragraph of text.
</p>
<hr />
<p>
This is the second paragraph of text. This is the second paragraph of text.
This is the second paragraph of text. This is the second paragraph of text.
</p>
Ergebnis
Technische Zusammenfassung
| Inhaltskategorien | Flussinhalt. |
|---|---|
| Erlaubter Inhalt | Keiner; es ist ein leeres Element. |
| Tag-Auslassung | Muss ein Start-Tag haben und darf keinen End-Tag haben. |
| Erlaubte Eltern |
|
| Implizite ARIA-Rolle | separator |
| Erlaubte ARIA-Rollen |
presentation oder none
|
| DOM-Schnittstelle | [`HTMLHRElement`](/de/docs/Web/API/HTMLHRElement) |
Spezifikationen
| Spezifikation |
|---|
| HTML # the-hr-element |