Maison  >  Article  >  interface Web  >  Comment utiliser l'attribut d'espace blanc CSS

Comment utiliser l'attribut d'espace blanc CSS

青灯夜游
青灯夜游original
2019-05-27 14:09:075586parcourir

L'attribut CSS white-space est utilisé pour définir la manière de gérer les espaces blancs dans les éléments. Par exemple, si white-space: nowrap est défini, tous les sauts de ligne et espaces au début et à la fin de la ligne seront fusionnés, le texte ne sera pas renvoyé à la ligne et continuera sur la même ligne jusqu'à ce que la balise

Comment utiliser l'attribut d'espace blanc CSS

Comment utiliser l'attribut d'espace blanc CSS ?

L'attribut white-space définit comment gérer les espaces dans l'élément.

Cet attribut déclare comment gérer les caractères d'espacement dans les éléments pendant le processus de mise en page.

Syntaxe :

white-space : normal | pre | nowrap | pre-wrap | pre-line ;

Valeur de l'attribut :

normal : Par défaut. Les espaces blancs sont ignorés par le navigateur.

pre : Les espaces vides seront conservés par le navigateur. Il se comporte comme la balise

 <p>nowrap : Le texte ne sera pas renvoyé à la ligne. Le texte continuera sur la même ligne jusqu'à ce que la balise <br> </p><p>pré-enveloppement : préserve les séquences d'espaces, mais enveloppe les lignes normalement. </p><p>pré-ligne : fusionne les séquences d'espaces mais conserve les nouvelles lignes. </p><p><strong>Remarque : </strong>Les valeurs pre-wrap et pre-line sont nouvelles dans CSS 2.1. </p><p>Remarque : Aucune version d'Internet Explorer (y compris IE8) ne prend en charge la valeur d'attribut « hériter ». </p><p><span style="font-size: 18px;"><strong>Propriété d'espace blanc CSS Exemple</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>

Sortie :

Comment utiliser lattribut despace blanc CSS

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn