font-synthesis-weight
Baseline
Widely available
Cette fonctionnalité est bien établie et fonctionne sur de nombreux appareils et versions de navigateurs. Elle est disponible sur tous les navigateurs depuis mars 2023.
La propriété CSS font-synthesis-weight permet de définir si le navigateur peut synthétiser la variante grasse lorsqu'elle n'est pas définie dans la famille de polices.
Il est souvent pratique d'utiliser la propriété raccourcie font-synthesis pour contrôler toutes les valeurs de synthèse de police.
Syntaxe
css
/* Valeurs avec un mot-clé */
font-synthesis-weight: auto;
font-synthesis-weight: none;
/* Valeurs globales */
font-synthesis-weight: inherit;
font-synthesis-weight: initial;
font-synthesis-weight: revert;
font-synthesis-weight: revert-layer;
font-synthesis-weight: unset;
Valeurs
Définition formelle
| Valeur initiale | auto |
|---|---|
| Applicabilité | all elements and text. S'applique aussi à ::first-letter et ::first-line. |
| Héritée | oui |
| Valeur calculée | comme spécifié |
| Type d'animation | discrète |
Syntaxe formelle
font-synthesis-weight =
auto |
none
Exemples
Désactiver la synthèse de la variante grasse
Cet exemple montre comment désactiver la synthèse de la variante grasse par le navigateur pour la police Montserrat.
HTML
html
<p class="francais">
Ceci est la variante <strong>grasse</strong> par défaut et la variante
<em>oblique</em>.
</p>
<p class="francais no-syn">
La variante <strong>grasse</strong> est désactivée ici, mais pas la variante
<em>oblique</em>.
</p>
CSS
css
@import "https://fonts.googleapis.com/css2?family=Montserrat&display=swap";
.francais {
font-family: "Montserrat", sans-serif;
}
.no-syn {
font-synthesis-weight: none;
}
Résultat
Spécifications
| Specification |
|---|
| CSS Fonts Module Level 4 # font-synthesis-weight |
Compatibilité des navigateurs
Voir aussi
- La propriété raccourcie
font-synthesiset les propriétésfont-synthesis-small-caps,font-synthesis-style - Les propriétés
font-style,font-variant,font-weight