<hr>: Das Thematische Trennelement (Horizontale Linie)
Baseline
Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since Juli 2015.
Das <hr> HTML-Element stellt einen thematischen Wechsel zwischen absatzbezogenen Elementen dar: zum Beispiel ein Szenenwechsel 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 dies als horizontale Trennlinie oder Linie dargestellt. Während es in visuellen Browsern weiterhin als horizontale Trennlinie angezeigt werden kann, ist dieses Element jetzt in semantischen Begriffen definiert, anstatt in präsentativen Begriffen. Wenn Sie eine horizontale Linie zeichnen möchten, sollten Sie dies mit geeignetem CSS tun.
Attribute
Die Attribute dieses Elements umfassen die globalen Attribute.
alignVeraltet Nicht standardisiert-
Bestimmt die Ausrichtung der Linie auf der Seite. Wenn kein Wert angegeben ist, ist der Standardwert
left. colorVeraltet Nicht standardisiert-
Bestimmt die Farbe der Linie durch Farbnamen oder hexadezimalen Wert.
noshadeVeraltet Nicht standardisiert-
Bestimmt, dass die Linie keinen Schatten haben soll.
sizeVeraltet Nicht standardisiert-
Bestimmt die Höhe der Linie in Pixeln.
widthVeraltet Nicht standardisiert-
Bestimmt 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 | Flow-Inhalt. |
|---|---|
| Zulässiger Inhalt | Keiner; es ist ein leeres Element. |
| Tag-Auslassung | Muss ein Start-Tag haben und darf kein End-Tag haben. |
| Zulässige Eltern |
|
| Implizierte ARIA-Rolle | separator |
| Zulässige ARIA-Rollen |
presentation oder none
|
| DOM-Schnittstelle | [`HTMLHRElement`](/de/docs/Web/API/HTMLHRElement) |
Spezifikationen
| Specification |
|---|
| HTML> # the-hr-element> |
Browser-Kompatibilität
Loading…