HTML: Horizontale Linie – So gehts

Nicht deine Sprache?

Mit dem <hr> Tag lassen sich horizontale Linien darstellen. Auch das <hr> Tag kannst du mit CSS noch etwas schöner machen. Wenn du eine klassische Horizontale Linie zeichnen möchtest. Gibst du einfach in deinen HTML Code ein <hr> Tag ein. Dieses Tag musst du nicht beenden denn es steht für sich alleine und bezeichnet keinen Bereich.

Beispiel: Einfache Linie

<hr>

Ergebnis


Mit etwas CSS kannst du die Linie noch etwas schöner gestalten.

<hr style="color: black; height: 20px;" />

Ergebnis

Das Ergebnis ist eine Rosa Linie mit einer höhe von 5 Pixel wie im CSS Code


Grundlegende Einstellungen

Wenn du kein eigenen CSS Element zu deiner Horizontalen Linie hinzufügst zeigen die Browser Standard mäßig diese Attribute an

hr {
display: block;
margin-top: 0.5em;
margin-bottom: 0.5em;
margin-left: auto;
margin-right: auto;
border-style: inset;
border-width: 1px;
}

Jetzt HTML lernen

[the_ad_group id=“4427″]

Mit horizontalen Linien lassen sich in HTML wunderbar Abschnitte oder Trennzeichen erstellen. Du kannst somit dem Leser einfacher zeigen das hier ein gewisser Abschnitt zu Ende ist und einer neuer beginnt. Auch mit CSS lassen sich strong><hr> Tag Tags bearbeiten und verändern.

Weitere Beiträge zu HTML

HTML: Text in Zwischenablage kopieren – So gehts
HTML: Grundgerüst – Webseite erstellen
HTML: Textarea erstellen – So gehts
PHP in HTML einfügen – So gehts!
HTML: Rahmen um Text – So gehts

HTML Datei öffnen – Kostenloser Editor 2021
HTML: Anker erstellen – So wirds gemacht!
HTML: 302 Redirect – So einfach gehts!
HTML: URL Parameter Erklärung
HTML: Bild einfügen – So gehts!

Jquery in HTML einbinden : So wirds gemacht!
HTML: Zurück Button & Link erstellen: So gehts!
HTML: Versteckter und Unsichtbarer Text : So gehs
HTML: Großbuchstaben schreiben: So gehts!
HTML: Icons einfügen: So gehts!

HTML: iFrame in Webseite einbinden – So gehts!
HTML: Liste erstellen – So gehts!
HTML: Erzwungenes Leerzeichen einfügen – So gehts!
CSS in HTML einbinden – So gehts!
HTML: Leerzeichen erstellen – So einfach gehts!

HTML: Auskommentieren – So gehts!
HTML: Bild zentrieren und mittig ausrichten
HTML: Fett schreiben – So einfach gehts!
HTML Text ausrichten: rechtsbündig & linksbündig
HTML: Zeilenabstand einstellen – So gehts!

HTML: Trennlinie einfügen – So gehts!
HTML: Absatz einfügen – So gehts!
HTML: Horizontale Linie – So gehts
HTML: Tabellen erstellen – So gehts!
HTML: Datum & Uhrzeit anzeigen – So gehts!


Über Mich



    html        html horizontale linie   

Generic selectors
Exact matches only
Search in title
Search in content
Post Type Selectors
smileys


Google Chrom: Bing entfernen – So gehts

Du bist absoluter Google Fan. Da ist es natürlich blöd wenn Bind in Google Chrome...

OpenOffice: Briefumschlag erstellen, beschriften, drucken

Oft ist es viel einfacher einen Briefumschlag am Computer bzw in OpenOffice zu erstellen und...

OpenOffice: Link (Hyperlink) einfügen – So gehts

Oft braucht man Hyperlinks bzw Link in normalen Dokumenten um einen Verweis auf einer Quelle...

OpenOffice: Textrahmen einfügen – So gehts

Oft möchte man in OpenOffice einen Text mit einem Rahmen versehen da es einfach schöner...

OpenOffice Writer: Hintergrundbild einfügen

Oft ist eine weiße Seite langweilig. Daher hast du in OpenOffice die Möglichkeit ein Hintergrundbild...

OpenOffice: Bild einfügen – So gehts

Oft ist es notwendig in OpenOffice ein einfaches Bild einzufügen. Bilder sagen oft mehr als...

OpenOffice: Textfeld einfügen und bearbeiten – So gehts

Textfelder sind in OpenOffice extrem hilfreich wenn du Dokumente erstellen möchtest. Ein Textfeld in OpenOffice...

OpenOffice: Sprache ändern und einstellen – So gehts

Oft ist OpenOffice nicht in der Sprache in der du arbeiten möchtest. Aber keine Sorge...

FritzBox: eigene Rufnummer anzeigen – So gehts

Oft hat man einen neuen Kabelanschluss oder ein neues Telefon, aber man weiß selbst garnicht...

FritzBox: Energiesparmodus aktivieren – So gehts

Wenn man an die Umwelt denkt, dann hat sich auch AVM darüber Gedanken gemacht. Denn...

FritzBox: Update & aktualisieren- So gehts

Es ist wichtig immer die Neusten Sicherheitsupdates für deine FritzBox zu installieren. Das ist nicht...

FritzBox: Einstellungen sichern und speichern

Oft ist es nicht schlecht ein Backup von den Einstellungen deiner FritzBox zu erstellen. Das...

FritzBox: Sprache ändern – So gehts

Wenn Deutsch nicht deine Muttersprache ist, dann kannst du die Sprache deiner FritzBox ändern und...

FritzBox: Sendeleistung erhöhen – So gehts

Hast du das Gefühl das deine Fritzbox nicht mit maximaler Power sendet? Du möchtest die...

FritzBox: Funkkanal ändern – So gehts

Wenn auf deinem jetzigen Funkkanal viele andere Router sind, dann solltest du ihn ändern um...