# HTML Horizontal Line mit dem hr-Tag Die HTML Horizontal Line ist eine Linie, die den Inhalt auf einer Website in zwei Abschnitte unterteilt. Das dazugehörige HTML-`

`-Tag benötigt kein abschließendes Element. ## Was ist eine HTML Horizontal Line? Eine HTML Horizontal Line wird genutzt, um eine **sichtbare und durchgehende Trennlinie** zwischen zwei Paragraphen oder anderen Sinnabschnitten in einem [HTML](https://www.ionos.de/digitalguide/websites/web-entwicklung/was-ist-html/)-Dokument zu ziehen. Sie wird mit dem HTML-`

`-Tag definiert und dient der besseren Strukturierung und Lesbarkeit einer Webseite. `

` ist nicht nur eine visuelle Trennlinie, sondern auch von semantischer Bedeutung: Das Element weist darauf hin, dass ein Themenwechsel oder eine thematische Pause erfolgt. Das [HTML-Tag](https://www.ionos.de/digitalguide/websites/web-entwicklung/html-tags/) kann theoretisch an einer beliebigen Stelle innerhalb des Elements [body](https://www.ionos.de/digitalguide/websites/web-entwicklung/html-body/) eingesetzt werden und kommt ohne ein schließendes Element aus. Die Abkürzung „hr“ steht für „horizontal ruler“ (dt. *horizontales Lineal*). HTML `

` unterstützt alle [HTML-Attribute](https://www.ionos.de/digitalguide/websites/web-entwicklung/html-attribute/) und wird von allen gängigen Browsern unterstützt. ## HTML `

`: Syntax und Beispiel Die Syntax von HTML `

` ist einfach, da Sie außer dem Tag keine weiteren Attribute oder Parameter benötigen: ```html

``` Die Funktionsweise des Elements können wir mit einem einfachen Beispiel für eine HTML Horizontal Line veranschaulichen. Dafür nehmen wir einen Absatz (`

`) und einen zitierten Text (`

`) und trennen die beiden Sinneinheiten in unserem HTML-Dokument durch eine horizontale Linie. Der passende Code sieht so aus: ```html
HTML Horizontale Linie

HTML ist die Standard-Auszeichnungssprache für Dokumente, die im Web angezeigt werden sollen. Sie beschreibt die Struktur einer Webseite und ermöglicht es, Text, Bilder, Links und andere Elemente zu definieren.

„HTML ist einfach zu lernen und bietet eine solide Grundlage für die Erstellung von Webseiten.“
``` [![Bild: Beispiel für eine horizontale Linie in HTML](https://www.ionos.de/digitalguide/fileadmin/_processed_/b/f/csm_html-horizontal-line-beispiel_4a18a2bfaa.webp "Beispiel für eine horizontale Linie in HTML")](https://www.ionos.de/digitalguide/fileadmin/DigitalGuide/Screenshots_2024/html-horizontal-line-beispiel.png) Durch die horizontale Linie werden Textpassage und Zitat visuell voneinander getrennt. ## Aussehen der horizontalen Linie in HTML anpassen Es ist möglich, das Aussehen einer HTML Horizontal Line anzupassen. Während dafür früher die Attribute `align`, `color`, `noshade`, `size` und `width` verwendet wurden, werden diese seit [HTML5](https://www.ionos.de/digitalguide/websites/web-entwicklung/was-ist-html5/) nicht mehr unterstützt. Stattdessen können Sie das [CSS](https://www.ionos.de/digitalguide/websites/webdesign/css-lernen-leicht-gemacht/)-Attribut [style](https://www.ionos.de/digitalguide/websites/web-entwicklung/html-style/) nutzen. Statt `align` verwenden Sie diesen Code: ```html
HTML Horizontale Linie

HTML ist die Standard-Auszeichnungssprache für Dokumente, die im Web angezeigt werden sollen. Sie beschreibt die Struktur einer Webseite und ermöglicht es, Text, Bilder, Links und andere Elemente zu definieren.

„HTML ist einfach zu lernen und bietet eine solide Grundlage für die Erstellung von Webseiten.“
``` Die **Farbe** der horizontalen HTML-Linie ändern Sie mit der Eigenschaft `color`: ```html
HTML Horizontale Linie

HTML ist die Standard-Auszeichnungssprache für Dokumente, die im Web angezeigt werden sollen. Sie beschreibt die Struktur einer Webseite und ermöglicht es, Text, Bilder, Links und andere Elemente zu definieren.

„HTML ist einfach zu lernen und bietet eine solide Grundlage für die Erstellung von Webseiten.“
``` Statt `noshade` nutzen Sie den folgenden Code, um eine horizontale Linie ohne Schatten einzubinden: ```html
Eine normale horizontale Linie:

Mit CSS:

``` Die **Höhe** verändern Sie mit `height`: ```html
Eine normale horizontale Linie:

Eine horizontale Linie mit einer Höhe von 50 Pixeln:

``` Die **Breite** der HTML Horizontal Line stellen Sie mit dem Parameter `width`: ```html
Eine normale horizontale Linie:

Eine horizontale Linie mit einer Breite von 30 Prozent:

``` This is a markdown version of: [https://www.ionos.de/digitalguide/websites/web-entwicklung/html-horizontal-line/](https://www.ionos.de/digitalguide/websites/web-entwicklung/html-horizontal-line/) for AI/LLM consumption.