CSS

Horizontale und senkrechte Trennlinien

Details

Veröffentlicht am Sonntag, 21. Dezember 2008 13:00

Geschrieben von Jan Pionzewski

Mittels des HTML-Tags <hr> lassen sich spielend leicht horizontale Trennlinien erstellen. Diest ist kein Geheimnis und schon seit Ewigkeiten in HTML implementiert. Doch es ist auch möglich, senkrechte Trennlinien zu erstellen - und das ohne viel Aufwand. Dieser Trick ist auch mit reinem HTML zu bewerkstelligen. Jedoch interpretiert der Browser Firefox die Angaben offenbar anders, denn Firefox stellt keine Trennlinie dar, sondern macht aus der Linie dicke Punkte.

Anhand des folgenden Beispiels wird Ihnen gezeigt, wie Sie mit Hilfe von CSS eine senkrechte Trennlinie erstellen können.


Beispiel CSS:

<hr noshade style="background-color: black; height: 100px; width: 1px;">

Sie können die Style-Definition der Trennlinie in ein externes Stylesheet auslagern. Natürlich lassen sich die Trennlinien auch vielfältig gestalten. Schauen Sie für weitere Informationen zu diesem Thema doch in unseren Artikel "Trennlinien mittels CSS gestalten".


Der Vollständigkeit halber hier noch einmal der reine HTML-Tag.
Beispiel HTML:

<hr noshade color="black" size="100" width="1">

Wichtiger Hinweis:
Der reine HTML-Tag wurde nur der Vollständigkeit halber hier aufgeführt. Bitte beachten Sie, dass dieser nicht von allen Browsern gleich interpretiert wird. Benutzen Sie daher besser ausschließlich die CSS-Variante.