Eine Zeile in HTML überspringen

1. Verwenden Sie das Tag <p>, um eine Zeile in HTML zu überspringen
2. Verwenden Sie zwei <br>-Tags, um eine Zeile in HTML zu überspringen
3. Setzen Sie die Eigenschaft opacity des Tags <hr> auf 0, um eine Zeile in HTML zu überspringen
4. Verwenden Sie die CSS-Eigenschaft margin, um eine Zeile in HTML zu überspringen

In diesem Artikel werden verschiedene Möglichkeiten zum Überspringen oder Hinzufügen einer Zeile in HTML untersucht.

Verwenden Sie das Tag <p>, um eine Zeile in HTML zu überspringen

Der einfachste Weg, eine Zeile in HTML zu überspringen, ist die Verwendung des <p>-Tags. Das <p>-Tag, ein Absatzelement, erstellt Absätze in HTML.

Absätze sind Elemente auf Blockebene, die einen Textblock in einem HTML-Dokument darstellen. Wir können immer eine Leerzeile zwischen zwei Absätzen finden.

So können zwei Absätze identifiziert werden. Mit dem Element <p> wird automatisch eine Zeile übersprungen.

Lassen Sie es uns in einem einfachen Beispiel implementieren.

Erstellen Sie zuerst ein <p>-Tag und schreiben Sie einen Text Ihrer Wahl in das Tag. Erstellen Sie als Nächstes ein weiteres <p>-Tag und schreiben Sie auch einige Absatzinhalte hinein.

Das folgende Code-Snippet fügt eine Leerzeile zwischen zwei Texten ein. So können wir in HTML eine Zeile zwischen Texten überspringen.

Beispielcode:

<p>
 The first paragraph
</p>
<p>
 The second paragraph
</p>

Verwenden Sie zwei <br>-Tags, um eine Zeile in HTML zu überspringen

Wir können auch das Tag <br> verwenden, um eine Zeile in HTML zu überspringen. Das <br>, ein Zeilenumbruchelement, unterbricht eine einzelne Zeile.

Bei zweimaliger Verwendung wird eine Leerzeile erstellt, da zwei aufeinanderfolgende Zeilen unterbrochen werden. Das Tag hat kein schließendes Tag; es wird als leeres Tag bezeichnet.

Eine Anwendung des <br>-Tags ist es, den Text beim Schreiben von Gedichten in eine neue Zeile zu lenken.

Sehen Sie sich das Beispiel unten an, wo wir das Tag <br> implementiert haben, um eine Zeile zwischen zwei Strophen eines Gedichts zu überspringen. Das Tag <br> am Ende der ersten Zeile unterbricht die Zeile und leitet zur nächsten Zeile weiter.

Nach der zweiten Zeile haben wir zwei <br>-Tags verwendet. Der erste unterbricht die Linie und leitet zur dritten Linie.

Dann unterbricht das zweite <br>-Tag die dritte Zeile und erzeugt eine Leerzeile. Danach haben wir eine weitere Gedichtstrophe mit einem einzigen <br>-Tag am Ende jeder Zeile geschrieben.

Das Beispiel zeigt also, wie wir mit zwei <br>-Tags eine Zeile zwischen Texten überspringen können.

Beispielcode:

<p>
 got out of the bed at four, not seven<br>
 after meditation, it was like heaven<br>
 <br>
 kept myself up, coding till eleven<br>
 lately i've been doing Java, I 'll be using Maven
</p>

Setzen Sie die Eigenschaft opacity des Tags <hr> auf 0, um eine Zeile in HTML zu überspringen

Diese Methode implementiert einen Trick, um eine Zeile in HTML zu überspringen. Der Trick besteht darin, das Tag <hr> zu verwenden und es unsichtbar zu machen.

Das Tag <hr> erzeugt eine horizontale Linie. Wir können die CSS-Eigenschaft opacity der horizontalen Linie auf 0 setzen.

Als Ergebnis sieht der von der horizontalen Linie eingenommene Raum wie eine leere Linie aus.

Schreiben Sie zum Beispiel einen Text Ihrer Wahl. Erstellen Sie als Nächstes eine horizontale Linie mit dem Tag <hr>.

Wenden Sie CSS-Stile inline mit dem Attribut style an. Setzen Sie die Eigenschaft opacity auf 0. Schreiben Sie nach dem <hr> eine weitere Zeile.

Hier macht der Wert 0 der Eigenschaft opacity die horizontale Linie vollständig transparent. Der Wert 0 macht das Element vollständig transparent, der Wert 1 macht es vollständig undurchsichtig.

Daher zeigt das Beispiel, wie wir mit dem Tag <hr> und der Eigenschaft opacity eine Zeile zwischen Texten überspringen können.

Beispielcode:

The line before blank line
<hr style="opacity:0">
The line after blank line

Verwenden Sie die CSS-Eigenschaft margin, um eine Zeile in HTML zu überspringen

Nun besprechen wir die letzte Methode zum Überspringen einer Zeile in HTML mit der CSS-Eigenschaft margin.

Wir können das Tag <section> verwenden, um den Textabschnitt darzustellen, der nach einer übersprungenen Zeile geschrieben werden soll. Dann können wir den Rand oben auf diesen Abschnitt anwenden, sodass Leerzeichen entstehen.

Schreiben Sie zum Beispiel einen Text Ihrer Wahl. Erstellen Sie als Nächstes ein <section>-Element und schreiben Sie einen Text hinein.

Wählen Sie in CSS das Element section und setzen Sie dessen Eigenschaft margin auf 1em 0. Der Wert 1em entspricht dem oberen und unteren Rand des Abschnitts.

Als Ergebnis werden am oberen und unteren Rand des Textes Leerzeichen in einer Größe erzeugt, die der Schriftgröße entspricht.

So können wir die CSS-Eigenschaft margin verwenden, um eine Leerzeile in HTML zu erstellen.

HTML Quelltext:

This is the first line
<section>This is the line after the skipped line</section>

CSS-Code:

section {
 margin: 1em 0;
}