La règle @ @font-feature-values permet aux auteurs d'utiliser un nom personnalisé dans une règle utilisant la propriété font-variant-alternates afin de régler finement les caractéristiques OpenType. Elle permet de simplifier les feuilles de style lorsqu'on utilise plusieurs polices.

@font-feature-values Font One {
/* On active la caractéristique nice-style 
   sur Font One */
  @styleset {
    nice-style: 12;
  }
}
 
@font-feature-values Font Two { 
/* On active la caractéristique nice-style
   sur Font Two */
  @styleset {
    nice-style: 4;
  }
} 

…
/* Indépendamment de la police */
.nice-look {
  font-variant-alternates: styleset(nice-style);
}

La règle @ @font-feature-values peut être utilisée au plus haut niveau d'une feuille de style et aussi au sein d'un groupe de règles conditionnelles.

Syntaxe

Blocs liés aux caractéristiques

@swash
Indique le nom d'une caractéristique qui fonctionnera avec la notation fonctionnelle swash(). Une telle caractéristique est définie avec une seule valeur : ident1: 2 est valide alors que ident2: 2 4 est invalide.
@annotation
Indique le nom d'une caractéristique qui fonctionnera avec la notation fonctionnelle annotation(). Une telle caractéristique est définie avec une seule valeur : ident1: 2 est valide alors que ident2: 2 4 est invalide.
@ornaments
Indique le nom d'une caractéristique qui fonctionnera avec la notation fonctionnelle ornaments(). La caractéristique d'ornement est définie avec une seule valeur : ident1: 2 est valide alors que ident2: 2 4 est invalide.
@stylistic
Indique le nom d'une caractéristique qui fonctionnera avec la notation fonctionnelle stylistic(). Une telle caractéristique est définie avec une seule valeur : ident1: 2 est valide alors que ident2: 2 4 est invalide.
@styleset
Indique le nom d'une caractéristique qui fonctionnera avec la notation fonctionnelle styleset(). Plusieurs valeurs peuvent être utilisées pour cette caractéristique : ident1: 2 4 12 1 correspondra aux valeurs OpenType ss02, ss04, ss12, ss01. Les valeurs supérieures à 99 sont valides mais ne correspondent à aucune valeur OpenType et sont donc ignorées.
@character-variant
Indique le nom d'une caractéristique qui fonctionnera avec la notation fonctionnelle character-variant(). Pour cette définition, on peut utiliser une ou deux valeurs : ident1: 2  correspond à cv02=1 et ident2: 2 4 correspond à  cv02)4, en revanche ident2: 2 4 5 est invalide.

Syntaxe formelle

@font-feature-values <family-name># {
  <feature-value-block-list>
}


<family-name> = <string> | <custom-ident>+
<feature-value-block-list> = <feature-value-block>+


<feature-value-block> = <feature-type> { <feature-value-declaration-list> }


<feature-type> = @stylistic | @historical-forms | @styleset | @character-variant | @swash | @ornaments | @annotation
<feature-value-declaration-list> = <feature-value-declaration>


<feature-value-declaration> = <custom-ident>: <integer>+;

Spécifications

Spécification État Commentaires
CSS Fonts Module Level 3
La définition de '@font-feature-values' dans cette spécification.
Candidat au statut de recommandation Définition initiale.

Compatibilité des navigateurs

Update compatibility data on GitHub
OrdinateurMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariWebview AndroidChrome pour AndroidEdge MobileFirefox pour AndroidOpera pour AndroidSafari pour iOSSamsung Internet
Support simple
Expérimentale
Chrome Aucun support NonEdge Aucun support NonFirefox Support complet 34
Support complet 34
Support complet 24
Désactivée
Désactivée From version 24: this feature is behind the layout.css.font-features.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
IE Aucun support NonOpera Aucun support NonSafari Support complet 9.1WebView Android Aucun support NonChrome Android Aucun support NonEdge Mobile Aucun support NonFirefox Android Support complet 34
Support complet 34
Support complet 24
Désactivée
Désactivée From version 24: this feature is behind the layout.css.font-features.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
Opera Android Aucun support NonSafari iOS Support complet 9.3Samsung Internet Android Aucun support Non
@annotation
Expérimentale
Chrome Aucun support NonEdge Aucun support NonFirefox Support complet 34
Support complet 34
Support complet 24
Désactivée
Désactivée From version 24: this feature is behind the layout.css.font-features.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
IE Aucun support NonOpera Aucun support NonSafari Support complet 9.1WebView Android Aucun support NonChrome Android Aucun support NonEdge Mobile Aucun support NonFirefox Android Support complet 34
Support complet 34
Support complet 24
Désactivée
Désactivée From version 24: this feature is behind the layout.css.font-features.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
Opera Android Aucun support NonSafari iOS Support complet 9.3Samsung Internet Android Aucun support Non
@character-variant
Expérimentale
Chrome Aucun support NonEdge Aucun support NonFirefox Support complet 34
Support complet 34
Support complet 24
Désactivée
Désactivée From version 24: this feature is behind the layout.css.font-features.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
IE Aucun support NonOpera Aucun support NonSafari Support complet 9.1WebView Android Aucun support NonChrome Android Aucun support NonEdge Mobile Aucun support NonFirefox Android Support complet 34
Support complet 34
Support complet 24
Désactivée
Désactivée From version 24: this feature is behind the layout.css.font-features.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
Opera Android Aucun support NonSafari iOS Support complet 9.3Samsung Internet Android Aucun support Non
@historical-forms
Expérimentale
Chrome Aucun support NonEdge Aucun support NonFirefox Support complet 34
Support complet 34
Support complet 24
Désactivée
Désactivée From version 24: this feature is behind the layout.css.font-features.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
IE Aucun support NonOpera Aucun support NonSafari Support complet 9.1WebView Android Aucun support NonChrome Android Aucun support NonEdge Mobile Aucun support NonFirefox Android Support complet 34
Support complet 34
Support complet 24
Désactivée
Désactivée From version 24: this feature is behind the layout.css.font-features.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
Opera Android Aucun support NonSafari iOS Support complet 9.3Samsung Internet Android Aucun support Non
@ornaments
Expérimentale
Chrome Aucun support NonEdge Aucun support NonFirefox Support complet 34
Support complet 34
Support complet 24
Désactivée
Désactivée From version 24: this feature is behind the layout.css.font-features.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
IE Aucun support NonOpera Aucun support NonSafari Support complet 9.1WebView Android Aucun support NonChrome Android Aucun support NonEdge Mobile Aucun support NonFirefox Android Support complet 34
Support complet 34
Support complet 24
Désactivée
Désactivée From version 24: this feature is behind the layout.css.font-features.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
Opera Android Aucun support NonSafari iOS Support complet 9.3Samsung Internet Android Aucun support Non
@styleset
Expérimentale
Chrome Aucun support NonEdge Aucun support NonFirefox Support complet 34
Support complet 34
Support complet 24
Désactivée
Désactivée From version 24: this feature is behind the layout.css.font-features.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
IE Aucun support NonOpera Aucun support NonSafari Support complet 9.1WebView Android Aucun support NonChrome Android Aucun support NonEdge Mobile Aucun support NonFirefox Android Support complet 34
Support complet 34
Support complet 24
Désactivée
Désactivée From version 24: this feature is behind the layout.css.font-features.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
Opera Android Aucun support NonSafari iOS Support complet 9.3Samsung Internet Android Aucun support Non
@stylistic
Expérimentale
Chrome Aucun support NonEdge Aucun support NonFirefox Support complet 34
Support complet 34
Support complet 24
Désactivée
Désactivée From version 24: this feature is behind the layout.css.font-features.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
IE Aucun support NonOpera Aucun support NonSafari Support complet 9.1WebView Android Aucun support NonChrome Android Aucun support NonEdge Mobile Aucun support NonFirefox Android Support complet 34
Support complet 34
Support complet 24
Désactivée
Désactivée From version 24: this feature is behind the layout.css.font-features.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
Opera Android Aucun support NonSafari iOS Support complet 9.3Samsung Internet Android Aucun support Non
@swash
Expérimentale
Chrome Aucun support NonEdge Aucun support NonFirefox Support complet 34
Support complet 34
Support complet 24
Désactivée
Désactivée From version 24: this feature is behind the layout.css.font-features.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
IE Aucun support NonOpera Aucun support NonSafari Support complet 9.1WebView Android Aucun support NonChrome Android Aucun support NonEdge Mobile Aucun support NonFirefox Android Support complet 34
Support complet 34
Support complet 24
Désactivée
Désactivée From version 24: this feature is behind the layout.css.font-features.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
Opera Android Aucun support NonSafari iOS Support complet 9.3Samsung Internet Android Aucun support Non

Légende

Support complet  
Support complet
Aucun support  
Aucun support
Fonctionnalité expérimentale. Celle-ci peut être amenée à changer par la suite.
Fonctionnalité expérimentale. Celle-ci peut être amenée à changer par la suite.
Une action explicite de l'utilisateur est nécessaire pour activer cette fonctionnalité.
Une action explicite de l'utilisateur est nécessaire pour activer cette fonctionnalité.

Voir aussi

Étiquettes et contributeurs liés au document

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