Leerzeichen zwischen Text in HTML hinzufügen

Sushant Poudel 19 Februar 2023
  1. Verwenden Sie das Tag <pre>, um Leerzeichen in den Text in HTML einzufügen
  2. Verwendung von &nbsp; um Leerzeichen in den Text in HTML einzufügen
  3. Verwenden Sie die CSS-Eigenschaft padding, um Leerzeichen in den Text in HTML einzufügen
Leerzeichen zwischen Text in HTML hinzufügen

In diesem Artikel werden einige Methoden zum Einfügen von Leerzeichen und Tabulatoren in den Text in HTML erläutert. HTML lässt im Allgemeinen nicht mehr als ein Leerzeichen gleichzeitig zu. Diese Methoden helfen, mehr als einen Leerraum hinzuzufügen.

Verwenden Sie das Tag <pre>, um Leerzeichen in den Text in HTML einzufügen

Das Tag <pre> definiert einen vorformatierten Text. Es stellt den Text genau so dar, wie er im HTML-Code geschrieben ist. Der Leerraum innerhalb dieses Tags wird wie beschrieben angezeigt. Es wird in fast allen Webbrowsern unterstützt. Mit dem Tag <pre> können wir mit HTML Leerzeichen in den Text einfügen. Das Tag <pre> unterstützt fast alle globalen Attribute im HTML.

Öffnen Sie beispielsweise im HTML-Body zunächst das Tag <pre>. Geben Sie innerhalb dieses Tags den Text Ihrer Wahl ein. Fügen Sie nun normalerweise einige zufällige Leerzeichen zwischen den Wörtern Ihres Satzes im Text hinzu (I'm learning HTML used in the example below) . Nachdem Sie Ihren gewünschten Text vervollständigt haben, schließen Sie das Tag <pre>. Vergessen Sie auch nicht, alle zuvor geöffneten Tags zu schließen.

Das folgende Beispiel veranschaulicht eine Methode zum Hinzufügen von Bank-Leerzeichen in den Text in HTML. Nach dem Öffnen des Tags <pre> gibt es einen vorformatierten Text an. Der Text I'm learning HTML wird in das Tag <pre> geschrieben. Wie wir sehen, werden zwischen den Wörtern learning und HTML fünf Leerzeichen verwendet. Die Ausgabe zeigt auch fünf Leerzeichen zwischen den beiden Wörtern an, so wie sie geschrieben wurde. Wir können so viel Platz einlegen, wie wir wollen. Auf diese Weise können wir in HTML Leerzeichen in den Text einfügen.

Beispielcode:

<pre> I'm learning HTML</pre>

Verwendung von &nbsp; um Leerzeichen in den Text in HTML einzufügen

Wir können das &nbsp; -Tag, um dem Text in einem HTML-Code ein Leerzeichen hinzuzufügen. Die Entität NBSP steht für non-breaking space. Ein geschütztes Leerzeichen interpretiert, dass es sich um ein Leerzeichen handelt, das nicht in eine neue Zeile umgebrochen wird. Zwei Wörter, die durch ein geschütztes Leerzeichen getrennt sind, befinden sich in derselben Zeile und nicht in verschiedenen Zeilen. Es ist vorteilhaft, Browser daran zu hindern, Leerzeichen in HTML-Seiten zu kürzen.

Geben Sie beispielsweise innerhalb des HTML-Textkörpers den gewünschten Text ein. Geben Sie an der Stelle, an der Sie das Leerzeichen einfügen möchten, &nbsp; ein. Sie müssen die gleiche Anzahl von &nbsp; eingeben. als das gewünschte Leerzeichen. Schreiben Sie fünf Instanzen von &nbsp; und fahren Sie mit der Eingabe des restlichen Textes fort. Schließen Sie nach Abschluss alle zuvor geöffneten Tags.

Das folgende Beispiel veranschaulicht eine andere Methode zum Hinzufügen von Leerzeichen in Ihrem Text in einem HTML-Code. Nach dem Wort lernen steht die Entität &nbsp; wird fünfmal nachbestellt. Dies impliziert, dass zwischen den Wörtern learning und HTML fünf Leerzeichen stehen. Wenn Sie im Code 5 Leerzeichen in Ihren Text eingeben, entfernt der Browser vier Leerzeichen, aber &nbsp hilft Ihnen, so viele Leerzeichen hinzuzufügen, wie Sie möchten. Dies ist also eine weitere Möglichkeit, Leerzeichen in einen HTML-Code einzufügen.

Beispielcode:

<body>
I'm learning&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;HTML 
</body>

Verwenden Sie die CSS-Eigenschaft padding, um Leerzeichen in den Text in HTML einzufügen

Wir können auch die CSS-Eigenschaft padding verwenden, um Leerzeichen in den Text in HTML einzufügen. Wir können die Eigenschaft padding mit dem Tag <span> verwenden, um das Leerzeichen zu erreichen. Das Tag <span> wird als Inline-Container bezeichnet, da es nicht in einer neuen Zeile beginnt. Es wird verwendet, um einen Text oder ein Dokument zu markieren. Es stellt von Natur aus nichts dar, da es allein keine visuelle Veränderung bewirkt. Es wird für Styling-Zwecke verwendet und wird auch in allen Webbrowsern unterstützt. Es unterstützt auch alle Global- und Event-Attribute in HTML. Wir können die Eigenschaft padding-left in einem <span>-Element verwenden, um Leerzeichen hinzuzufügen.

Geben Sie beispielsweise innerhalb des HTML-Textkörpers den gewünschten Text ein. An der Stelle, an der Sie den Leerraum einfügen möchten, erstellen Sie ein <span>-Element und wenden Sie den Stil darin an. Setzen Sie die Eigenschaft padding-left auf 30px. Schließen Sie danach das Tag <span>. Schreiben Sie den restlichen Text und schließen Sie alle zuvor geöffneten Tags im Code.

Im folgenden Beispiel haben wir nach dem Wort learning ein Element <span> erstellt. Wir haben im Element den linken Padding von 30px angewendet. Das heißt, wir haben nach dem Wort learning ein Leerzeichen von 30px erstellt und dann den Rest des Wortes fortgesetzt. Daher haben wir mit CSS und HTML Leerzeichen in den Text eingefügt.

Beispielcode:

<body>
I'm learning <span style="padding-left:30px;"></span>HTML
</body>
Sushant Poudel avatar Sushant Poudel avatar

Sushant is a software engineering student and a tech enthusiast. He finds joy in writing blogs on programming and imparting his knowledge to the community.

LinkedIn

Verwandter Artikel - HTML Space