Senkrechte Trennlinien mit CSS erstellen

Mit dem HTML Tag <hr> lassen sich spielend leicht horizontale Trennlinien erstellen. Dies ist dazu auch schon sehr lange in HTML möglich. Aber du kannst auch ohne viel Aufwand senkrechte Trennlinien erstellen. Obwohl man das auch in reinem HTML machen kann, zeige ich dir hier die Variante via CSS. Jedenfalls setzen nicht alle Browser die HTML Variante gleich um. Weiterhin ist darüber hinaus HTML nicht länger für die Gestaltung von Elementen vorgesehen.

Anhand des folgenden Beispiels zeige ich dir daher, wie du mit Hilfe von CSS eine senkrechte Trennlinie erstellen kannst.

 

Senkrechte Trennlinien mit CSS in die Website einbauen

Mit CSS ist es dabei spielend einfach möglich, eine senkrechte Trennlinie zu erstellen. Schaue dir dazu das folgende Beispiel an.

 

Beispiel:

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

 

Du kannst die Style-Definition der Trennlinie dabei auch in ein externes Stylesheet auslagern. Natürlich lassen sich die Trennlinien weiterhin vielfältig gestalten. Schau dir für weitere Informationen zu diesem Thema den Artikel „Trennlinien mit CSS gestalten“ an.

 


Dir gefällt dieser Artikel?

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht.