Heim  >  Artikel  >  Web-Frontend  >  So behalten Sie Leerzeichen im Text in HTML bei

So behalten Sie Leerzeichen im Text in HTML bei

醉折花枝作酒筹
醉折花枝作酒筹Original
2021-06-04 16:39:197389Durchsuche

In HTML können Sie das Attribut „white-space“ verwenden, um Leerzeichen im Text beizubehalten. Sie müssen lediglich den Stil „white-space:pre|pre-line“ im Element festlegen. Das Attribut „white-space“ gibt an, wie mit Leerzeichen in Elementen während des Layoutprozesses umgegangen wird.

So behalten Sie Leerzeichen im Text in HTML bei

Die Betriebsumgebung dieses Tutorials: Windows7-System, CSS3- und HTML5-Version, Dell G3-Computer.

Regeln für Leerzeichen in HTML

Mehrere Leerzeichen im Inhalt in HTML werden im Allgemeinen als eins betrachtet und mehrere aufeinanderfolgende Leerzeichen werden automatisch zusammengeführt. Gleichzeitig werden auch die Leerzeichen vor und nach dem Inhalt wie folgt gelöscht:

<p> fly63   com </p> 

Der Anzeigeeffekt ist:

fly63 com 

Hinweis: Dieser Mechanismus des Browsers gilt auch für Tabulatoren (t) und Zeilenumbrüche ( r und n), was explizit durch die Verwendung des 0c6dc11e160d3b678d68754cc175188a-Tags ausgedrückt werden kann

Das Whitespace-Attribut legt fest, wie Leerzeichen innerhalb eines Elements behandelt werden.

Dieses Attribut legt fest, wie mit Leerzeichen in Elementen während des Layoutprozesses umgegangen wird. Die Werte pre-wrap und pre-line sind neu in CSS 2.1.

1. Wenn der Wert des Leerraumattributs in CSS pre ist, wird es gemäß dem e03b848252eb9375d56be284e690e873-Tag verarbeitet. Der Browser behält Leerzeichen und Zeilenumbrüche im Text bei. Beispiel:

<p style="white-space:pre"> fly63  com <p>

Der Anzeigeeffekt ist: „fly63 com“

2 Wenn das Leerzeichenattribut von CSS vor der Zeile steht, bedeutet dies, dass Zeilenumbrüche beibehalten werden . Bis auf das Newline-Zeichen, das so ausgegeben wird, wie es ist, entspricht alles andere der Regel „white-space:normal“.

<p style="white-space: pre-line">
	fly63
	com
</p>

Der Anzeigeeffekt ist:

'fly63

com'

Empfohlenes Lernen: HTML-Video-Tutorial

Das obige ist der detaillierte Inhalt vonSo behalten Sie Leerzeichen im Text in HTML bei. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn