La propriété letter-spacing définit l'interlettre utilisée pour les caractères qui composent le texte.
/* Valeurs de longueur */ /* Type <length> */ letter-spacing: 0.3em; letter-spacing: 3px; letter-spacing: .3px; /* Valeur avec mot-clé */ letter-spacing: normal; /* Valeurs globales */ letter-spacing: inherit; letter-spacing: initial; letter-spacing: unset;
| Valeur initiale | normal |
|---|---|
| Applicabilité | tous les éléments. S'applique aussi à ::first-letter et ::first-line. |
| Héritée | oui |
| Média | visuel |
| Valeur calculée | une valeur optimale consistant en une longueur absolue ou normal |
| Type d'animation | une longueur |
| Ordre canonique | l'ordre unique et non-ambigu défini par la grammaire formelle |
Syntaxe
Valeurs
normal- L'interlettre est dictée par la police utilisée. À la différence de 0, cette valeur permet à l'agent utilisateur de modifier l'espace entre les caractères afin de le justifier.
<length>- Cette valeur indique l'espace ajouté à l'espace par défaut. Les valeurs peuvent être négatives mais les limites imposées dépendent de l'implémentation du moteur. Les agents utilisateurs ne pourront plus augmenter ou réduire l'interlettre afin de justifier le texte. Pour les différentes unités possibles, se référer à la page
<length>.
Syntaxe formelle
normal | <length>
Exemples
CSS
.premier { letter-spacing: 0.4em; }
.deuxieme { letter-spacing: 1em; }
.troisieme { letter-spacing: -0.05em; }
.quatrieme { letter-spacing: 6px; }
HTML
<p class="premier">Et voici l'interlettre</p> <p class="deuxieme">Et voici l'interlettre</p> <p class="troisieme">Et voici l'interlettre</p> <p class="quatrieme">Et voici l'interlettre</p>
Résultat
Spécifications
| Spécification | État | Commentaires |
|---|---|---|
| CSS Text Module Level 3 La définition de 'letter-spacing' dans cette spécification. |
Version de travail | Aucune modification. |
| CSS Transitions La définition de 'letter-spacing' dans cette spécification. |
Version de travail | letter-spacing peut désormais être animée. |
| CSS Level 2 (Revision 1) La définition de 'letter-spacing' dans cette spécification. |
Recommendation | Aucune modification. |
| Scalable Vector Graphics (SVG) 1.1 (Second Edition) La définition de 'letter-spacing' dans cette spécification. |
Recommendation | Définition initiale pour SVG. |
| CSS Level 1 La définition de 'letter-spacing' dans cette spécification. |
Recommendation | Définition initiale. |
Compatibilité des navigateurs
| Fonctionnalité | Chrome | Firefox (Gecko) | Edge | Internet Explorer | Opera | Safari (WebKit) |
|---|---|---|---|---|---|---|
| Prise en charge pour HTML | 1.0 | 1.0 (1.7 ou moins) | (Oui) | 4.0 | 3.5 | 1.0 (85) |
| Prise en charge pour SVG | (Oui) | Pas de support (bug 371787) | ? | ? | (Oui) | (Oui) |
| Fonctionnalité | Android | Firefox Mobile (Gecko) | Edge | IE Mobile | Opera Mobile | Safari Mobile |
|---|---|---|---|---|---|---|
| Prise en charge pour HTML | ? | ? | (Oui) | ? | ? | ? |
| Prise en charge pour SVG | ? | ? | ? | ? | ? | ? |