Heim > Artikel > Web-Frontend > So verwenden Sie das CSS-Leerraumattribut
So verwenden Sie das CSS-Leerraumattribut
- 青灯夜游Original
- 2019-05-27 14:09:075593Durchsuche
Das CSS-Attribut „white-space“ wird verwendet, um festzulegen, wie mit Leerzeichen innerhalb von Elementen umgegangen wird. Wenn beispielsweise „white-space: nowrap“ festgelegt ist, werden alle Zeilenumbrüche und Leerzeichen am Anfang und Ende der Zeile zusammengeführt. Der Text wird nicht umgebrochen und der Text wird in derselben Zeile fortgesetzt, bis das Tag
Wie verwende ich CSS-Leerraumattribute?
Das Whitespace-Attribut legt fest, wie mit Leerzeichen innerhalb des Elements umgegangen wird.
Dieses Attribut legt fest, wie mit Leerzeichen in Elementen während des Layoutprozesses umgegangen wird.
Syntax:
white-space : normal | pre | nowrap | pre-wrap | pre-line ;
Attributwert:
normal: Standard. Leerzeichen werden vom Browser ignoriert.
pre: Leerzeichen werden vom Browser beibehalten. Es verhält sich wie das
-Tag in HTML. <p>nowrap: Der Text wird nicht umgebrochen, bis das Tag <br> gefunden wird. </p><p>Vorumbruch: Leerzeichensequenzen beibehalten, Zeilen aber normal umbrechen. </p><p>Vorzeile: Leerzeichensequenzen zusammenführen, aber Zeilenumbrüche beibehalten. </p><p><strong>Hinweis: </strong>Die Werte pre-wrap und pre-line sind neu in CSS 2.1. </p><p>Hinweis: Jede Version von Internet Explorer (einschließlich IE8) unterstützt den Attributwert „inherit“ nicht. </p><p><span style="font-size: 18px;"><strong>Beispiel für eine CSS-Leerraumeigenschaft</strong></span></p><pre class="brush:php;toolbar:false"><!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
</head>
<head>
<style type="text/css">
.box{
width: 500px;
border: 1px solid #000;
margin-bottom:10px ;
}
.p1 {
white-space: nowrap
}
</style>
</head>
<body>
<div class="box">
<p>
php中文网
php中文网
php中文网
php中文网
php中文网
php中文网
php中文网
php中文网
php中文网
</p>
</div>
<div class="box">
<p class="p1">
php中文网
php中文网
php中文网
php中文网
php中文网
php中文网
php中文网
php中文网
php中文网
</p>
</div>
</body>
</html>Ausgabe:
Das obige ist der detaillierte Inhalt vonSo verwenden Sie das CSS-Leerraumattribut. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!