font-variation-settings

La propriété CSS font-variation-settings permet de contrôler les caractéristiques typographiques de bas niveau pour les polices OpenType ou TrueType en utilisant les quatres lettres représentant les axes des caractéristiques qu'on souhaite faire varier, ainsi que les valeurs pour les variations associées.

/* Valeur pour les réglages par défaut */
font-variation-settings: normal;

/* Utilisation des valeurs */
/* pour les axes OpenType  */
font-variation-settings: "XHGT" 0.7;

/* Valeurs globales */
font-variation-settings: inherit;
font-variation-settings: initial;
font-variation-settings: unset;

Cette propriété fonctionne à un niveau plus bas que font-feature-settings qui permet de définir les valeurs et les étiquettes (tags) pour les caractéristiques des polices.

Note : Si possible, les auteurs web devraient utiliser d'autres méthodes pour contrôler l'affichage des polices de caractères et notamment la propriété raccourcie font-variant ou une des propriétés détaillée associée. Cette propriété est une fonctionnalité de bas niveau destinée à gérer les cas spécifiques pour lesquels il est autrement impossible d'activer ou de paramétrer une caractéristique OpenType existante.

Valeur initialenormal
Applicabilitétous les éléments. S'applique aussi à ::first-letter et ::first-line.
Héritéeoui
Médiavisuel
Valeur calculéecomme spécifié
Type d'animationune transformation
Ordre canoniqueselon la grammaire

Syntaxe

La valeur de cette propriété peut être définie selon deux formes :

  • Avec le mot-clé normal
  • Ou avec une chaîne de caractères (<string>) suivi d'un nombre (<number>). Ce motif peut être répété tant qu'une virgule sépare chacun des tuples.

Valeurs

normal
Le texte est disposé avec les caractéristiques par défaut.
<string> <number>
Lors de l'affichage du texte, les axes OpenType sont passés au motur graphique afin d'activer ou de désactiver certaines fonctionnalités de la police. Chaque valeur est une chaîne de caractères (type <string>) avec quatre caractères ASCII, suivie par un nombre (type number) qui indique la valeur pour l'axe correspondant. Si la chaîne de caractères <string> a plus ou moins de 4 caractères et contient des caractères en dehors de l'intervalle U+20 - U+7E, la propriété sera considérée comme invalide. La valeur numérique <number> n'est pas nécessairement entière et positive, ce peut être un nombre décimal ou un nombre négatif.

Syntaxe formelle

normal | [ <string> <number> ]#

Exemples

Reste à écrire

Spécifications

Spécification État Commentaires
CSS Fonts Module Level 4
La définition de 'font-variation-settings' dans cette spécification.
Version de travail Définition initiale.

Compatibilité des navigateurs

FonctionnalitéChromeEdgeFirefoxInternet ExplorerOperaSafari
Support simple62 Non1532 Non49113
FonctionnalitéAndroid webviewChrome for AndroidEdge mobileFirefox for AndroidOpera AndroidiOS SafariSamsung Internet
Support simple6262 Non153249114 Non

1. In development.

2. From version 53: this feature is behind the layout.css.font-variations.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.

3. Requires macOS 10.13 High Sierra or later.

4. Requires iOS 11 or later.

Voir aussi

Étiquettes et contributeurs liés au document

 Contributeurs à cette page : SphinxKnight
 Dernière mise à jour par : SphinxKnight,