Propriété CSS word-spacing

La propriété word-spacing permet de modifier l'espace entre les mots dans un texte, et non pas entre les caractères individuels.

Cette propriété peut prendre une valeur positive ou négative. Une valeur positive ajoute de l'espace supplémentaire entre les mots, tandis qu'une valeur négative réduit l'espace entre les mots. Lorsque la propriété est définie sur "normal", la police définie spécifiera l'espace entre les mots.

Pour supprimer l'espace entre les éléments inline-block, vous pouvez définir la font-size du conteneur sur 0 ou utiliser des marges négatives.

La propriété word-spacing peut être animée à l'aide de la propriété transition.

INFO

La propriété word-spacing s'applique au contenu en ligne.

Valeur initiale	normal
S'applique à	Tous les éléments. S'applique également à ::first-letter et ::first-line.
Héritée	Oui.
Animable	Oui. Word-spacing est animable.
Version	CSS1
Syntaxe DOM	object.style.wordSpacing = "40px";

Syntaxe

Syntaxe de la propriété CSS word-spacing

css

word-spacing: normal | length | initial | inherit;

Exemple de la propriété word-spacing avec la valeur "normal" :

Exemple de la propriété CSS word-spacing avec la valeur normal

html

<!DOCTYPE html>
<html>
  <head>
    <title>Title of the document</title>
    <style>
      .text {
        word-spacing: normal;
      }
    </style>
  </head>
  <body>
    <h2>Word-spacing property example</h2>
    <p class="text">Lorem ipsum is simply dummy text...</p>
  </body>
</html>

Try it Yourself »

Dans l'exemple suivant, l'espace entre les mots est de 20px :

Exemple de la propriété word-spacing spécifiée en "px" :

Exemple de la propriété CSS word-spacing avec une valeur de longueur (px)

html

<!DOCTYPE html>
<html>
  <head>
    <title>Title of the document</title>
    <style>
      .text {
        word-spacing: 20px;
      }
    </style>
  </head>
  <body>
    <h2>Word-spacing property example</h2>
    <p class="text">Lorem ipsum is simply dummy text...</p>
  </body>
</html>

Try it Yourself »

Résultat

CSS word-spacing Property

Valeurs

Valeur	Description	Tester
normal	Définit un espacement normal entre les mots. Il s'agit de la valeur par défaut de cette propriété.	Tester »
length	Définit un espacement supplémentaire entre les mots. Peut être spécifié en px, pt, cm, em, etc. Les valeurs négatives sont valides.	Tester »
initial	Définit la valeur par défaut de la propriété.	Tester »
inherit	Hérite la propriété de son élément parent.

Pratique

Que fait la propriété CSS 'word-spacing' ?

Elle spécifie l'espace entre les mots dans une phrase.Elle spécifie l'espace entre les caractères dans un mot.Elle détermine la hauteur de ligne d'un texte.Elle spécifie la longueur d'un texte.Elle définit la distance entre le texte et les bords gauche ou droit de son conteneur.

Propriété CSS word-spacing ​

Syntaxe ​

Exemple de la propriété word-spacing avec la valeur "normal" : ​

Exemple de la propriété word-spacing spécifiée en "px" : ​

Résultat ​

Valeurs ​