CSS, HTML UND JAVASCRIPT MIT {STIL}

Die hr-Linie wirkt eingedrückt, ist schlicht und grau und läuft über die gesamte Breite der umfassenden Box. Der exakte Abstand zwischen dem Text oder den Bildern von der Linie hängt vom jeweiligen Browser ab.

---

In XHTL muss das hr-Tag geschlossen werden: <hr />

hr-Tag: Farbige Linie

<hr />
<hr style="color: red; background: blue; height: 15px;" />

---

Die CSS-Eigenschaften color und background bringen Farben in die hr-Linie, da einige Browser color für die Farbe der Linie benutzen und andere Browser background.

Umfließen von float-Elementen mit hr beenden

Eigentlich benutzt niemand mehr die spartanischen Linien, die das hr-Tag ohne CSS-Zutaten erzeugt. So hat das hr-Tag eine andere Aufgabe übernommen: Es beendet das Umfließen von Bildern oder Boxen, die durch die CSS-Eigenschaft float umgesetzt wird.

Erst eins,

dann zwei

dann drei

---

Ein hr-Tag mit CSS clear: both; visibility: hidden; versetzt alle Elemente unterhalb des unsichtbaren hr-Tags wieder an den linken oder rechten Rand.

hr { clear: both; visibility: hidden; }
…
<p><img style="float: right;" … /> Erst eins, </p>
<hr />
<p><img style="float: right;" … /> Erst zwei, </p>
<hr />

Erst eins,

---

dann zwei

---

dann drei

---

Attribute und Events für hr-Tags

Attribute	Events
class, dir, id, lang, style, title	onclick, ondblclick onkeydown, onkeypress, onkeyup mousedown, mousemove, mouseout, mousedown, mouseup