Une remarque ? Une suggestion ?...

Merci de participer à l'amélioration de ce site. Prenez le temps de rédiger votre remarque le plus précisément possible :

CSS - Propriété font-synthesis

Description de la propriété font-synthesis.

font-synthesis autorise ou non le navigateur à générer les styles de caractères qui ne sont pas définis dans la police (obliques, super gras, etc). La plupart des polices incluent au moins les styles italique et gras, mais ce n'est pas le cas de toutes les polices fantaisie ni des polices de caractères asiatiques.

Le calcul des styles gras, et surtout italique, donne parfois de mauvais résultats. Il est alors préférable de le désactiver, et donc d'afficher des caractères standards.

A ce jour (janvier 2020) peu de navigateurs traitent cette propriété. Il est pourtant déjà prévu des évolutions : font-synthesis devrait gérer prochainement la simulation des petites capitales.

Syntaxes pour font-synthesis.

  • font-synthesis: weight style;

    Valeur par défaut. Le navigateur est autorisé à synthétiser les graisses de caractères manquantes dans la police, ou les styles comme italique et oblique.

  • font-synthesis: weight;

    Le navigateur est autorisé à synthétiser les graisses de caractères manquantes dans la police. Mais il ne doit pas synthétiser les italiques, ni les obliques.

  • font-synthesis: style;

    Le navigateur est autorisé à synthétiser les styles italique ou oblique s'ils sont manquants dans la police, mais ne doit pas synthétiser les graisses de caractères.

  • font-synthesis: none;

    Le navigateur ne synthétise ni les graisses manquantes, ni les styles manquants.

  • font-synthesis: initial;

    La valeur initiale est weight style.

  • font-synthesis: unset; font-synthesis: inherit;

    Reportez-vous à la description générale de ces valeurs.

Simulateur.

La police choisie est volontairement dépourvue des variantes gras et italique. Le navigateur simule ces attributs, ou pas, en fonction de font-synthesis.

font-synthesis :
Texte en gras
Texte en italique
Texte en oblique
Texte en petites capitales

Voir aussi...

Polices et caractères - Propriétés.

  • font : Raccourci pour définir la plupart des propriétés concernant les polices de caractères.
  • font-display : Détermine le comportement du navigateur face aux polices de caractères longues à charger.
  • font-family : Définit le nom de la police de caractères.
  • font-feature-settings : Permet d'exploiter les fonctionnalités spécifiques des polices de caractères OTF, WOFF, etc.
  • font-kerning : Ajustement du crénage entre caractères.
  • font-size : Ajuste la taille des caractères.
  • font-size-adjust : Définition du coefficient d'aspect de la police.
  • font-stretch : Modifie l'étirement ou la compression des caractères.
  • font-style : Sélectionne les styles italique ou oblique de la police de caractères.
  • font-variant : Raccourci permettant de définir les attributs typographiques évolués : ligatures, substitution de caractères, etc.
  • font-variant-alternates : Met en œuvre la substitution de caractères (polices OTF, WOFF).
  • font-variant-caps : Applique une capitalisation des caractères.
  • font-variant-east-asian : Typographie spécifique aux caractères chinois ou japonais.
  • font-variant-ligatures : Active ou désactive la ligature des caractères.
  • font-variant-numeric : Met en œuvre les modes d'affichage des nombres évolués : fractions, numéros, etc.
  • font-weight : Sélectionne une graisse pour les caractères.
  • text-decoration : Choisit le soulignement, le surlignement ou la rayure du texte.
  • text-decoration-color : Définit la couleur du trait de décoration.
  • text-decoration-line : Type de décoration : souligné, barré, etc.
  • text-decoration-style : Type de trait pour la décoration : plein, pointillé, etc.
  • text-shadow : Ombrage du texte.
  • text-transform : Casse du texte (minuscules, majuscules...).

Polices et caractères - Directives.

  • @charset : Indique le jeu de caractères utilisé dans la feuille de styles.
  • @font-face : Définit tous les paramètres d'une police de caractères téléchargeable.
  • @font-feature-values : Définit les variantes typographiques à utiliser.