Comment définir l'espacement des caractères en CSS-tutoriel CSS-php.cn

Comment définir l'espacement des caractères en CSS

青灯夜游

Libérer： 2021-10-12 16:26:49

original

91303 Les gens l'ont consulté

Comment définir l'espacement des mots en CSS : 1. Utilisez l'attribut letter-spacing, la syntaxe "letter-spacing : spacing value ;" 2. Utilisez l'attribut word-spacing, la syntaxe "word-spacing : spacing value ; ".

Comment définir l'espacement des caractères en CSS

L'environnement d'exploitation de ce tutoriel : système Windows7, version CSS3&&HTML5, ordinateur Dell G3.

Comment définir l'espacement des mots en CSS ? Ajuster l'espacement entre le texte ? L’article suivant vous le présentera.

Méthode 1 : utilisez la propriété letter-spacing - espacement des caractères

propriété letter-spacing pour augmenter ou diminuer l'espace entre les caractères (espacement des caractères), cette propriété définit la quantité d'espace insérée entre les zones de caractères de texte. Étant donné que les glyphes de caractères sont généralement plus étroits que leurs zones de caractères, la spécification d'une valeur de longueur ajuste l'espacement habituel entre les lettres. Par conséquent, la valeur normale équivaut à une valeur de 0.

Pour cet attribut : chaque caractère chinois est considéré comme un « caractère », et chaque lettre anglaise est également considérée comme un « caractère » ! Chacun doit donc y prêter une attention particulière.

Exemple :

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<style>
			.demo{
				width:500px;
				height: 500px;
				margin: 50px auto;
			}
			p{
				letter-spacing:20px;
			}
		</style>
	</head>
	<body>
		<div class="demo">
			<p>a b c d 你 好 a ！</p>
			<p>ab cd 你好a！</p>
		</div>
	</body>
</html>

Copier après la connexion

Comment définir lespacement des caractères en CSS

Méthode 2 : Utilisez l'attribut d'espacement des mots - l'espacement des mots

L'attribut d'espacement des mots augmente ou diminue l'espace entre les mots (c'est-à-dire l'espacement des mots dans ce cas) ; attribut, " "Mot" est défini comme une chaîne entourée de caractères d'espacement.

C'est-à-dire que cet attribut ajuste l'espacement en fonction des espaces :

Si plusieurs lettres sont reliées entre elles, elles seront considérées comme un seul mot par espacement des mots ;
Si les caractères chinois sont séparés par des espaces ; , alors les multiples caractères chinois séparés sont considérés comme des mots différents et l'attribut d'espacement des mots est valide à ce moment-là.

Exemple :

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<style>
			.demo{
				width:500px;
				height: 500px;
				margin: 50px auto;
			}
			p{
				word-spacing:20px;
			}
		</style>
	</head>
	<body>
		<div class="demo">
			<p>a b c d 你 好 a ！</p>
			<p>ab cd 你好a！</p>
		</div>
	</body>
</html>

Copier après la connexion

Comment définir lespacement des caractères en CSS