Maison >interface Web >tutoriel CSS >Compréhension approfondie de la différence entre l'espacement des mots CSS et l'espacement des lettres (avec code)
Compréhension approfondie de la différence entre l'espacement des mots CSS et l'espacement des lettres (avec code)
- yuliaoriginal
- 2018-09-08 10:45:315893parcourir
CSS définit un "mot" comme une chaîne de caractères autres que des espaces, entourée d'une sorte de caractère d'espacement. Les attributs d'espacement des lettres et d'espacement des mots sont utilisés pour ajouter des espaces à leurs éléments correspondants. Parfois, les deux sont souvent confondus. Parlons ensuite du paramétrage des intervalles en CSS.
1. espacement des mots Augmente ou réduit l'espace entre les mots (c'est-à-dire l'espacement des mots)
1. Récupère ou définit le nombre d'espaces insérés entre les mots dans l'objet. , les valeurs négatives sont autorisées.
2. La valeur par défaut est normale, ce qui équivaut à la définir sur 0
3. Les valeurs négatives sont autorisées, ce qui rendra les lettres plus compactes
4. espace trop large dans le document, utilisez donc l'espacement des mots avec prudence
2. espacement des lettres Augmentez ou réduisez l'espace entre les caractères (c'est-à-dire l'espacement des caractères)
1 . Paramètres L'espacement entre les caractères dans l'objet. Chaque caractère chinois et lettre anglaise est séparé par la distance définie. Cette propriété contrôle l'espacement des caractères. Sa valeur d'attribut est applicable au chinois et à l'anglais
2. La valeur par défaut est normale, ce qui équivaut à la définir sur 0
3. Utilisez l'espacement des lettres, qui ne fonctionne que sur le texte et n'a aucun effet sur les images. .
4. Utiliser l'espacement des lettres Les caractères chinois sont espacés d'un mot et les anglais sont espacés d'une lettre
Exemple : C'est la même phrase, indiquez l'espacement des lettres et l'espacement des mots. attributs respectivement, et voyez s'ils ont Quelle est la différence
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
.a1{letter-spacing: 15px;}
.a2{word-spacing: 15px;}
</style>
</head>
<body>
<p class="a1">have a nice day 今天心情怎么样呢？</p>
<p class="a2">have a nice day 今天心情怎么样呢？</p>
</body>
</html>Rendu :
Résumé : l'espacement des mots en CSS augmente ou diminue l'espace entre les mots (c'est-à-dire l'intervalle des mots), l'espacement des lettres augmente ou diminue l'espace entre les caractères (c'est-à-dire l'espacement des caractères). Par défaut, nous n’utilisons presque pas l’espacement des lettres. Nous pouvons simplement utiliser le style par défaut du navigateur.
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!