CSS - Propriété font-size

Description.

La propriété font-size définit la taille des caractères.

Syntaxes pour font-size.

• font-size: xx-small; font-size: x-small; font-size: small; font-size: medium; font-size: large; font-size: x-large; font-size: xx-large; font-size: xxx-large;

  Tailles de caractères prédéfinies par CSS. La valeur par défaut est medium.
  Voici le rapport entre ces différentes tailles, relativement à medium.

  xx-small	0.6 (3/5)	h6
  x-small	0.75 (3/4)
  small	0.89 (8/9)	h5
  medium	1	h4
  large	1.2 (6/5)	h3
  x-large	1.5 (3/2)	h2
  xx-large	2	h1
  xxx-large	3

• font-size: 12px;

  Une valeur numérique positive, suivie d'une unité de dimension (voir les unités de dimensions en CSS). Certaines unités sont spécifiquement adaptées aux tailles de caractères : pt, em, rem, ch, ex, etc.
  Si la valeur est exprimée en pourcentages, ceux-ci sont calculées par rapport à la taille des caractères de l'élément parent.
  L'unité em est évaluée de la même façon, tandis que l'unité rem est évaluée par rapport à la taille des caractères de l'élément racine (balise html ou sélecteur :root.

• font-size: smaller;

  Caractères une taille en dessous de celle des caractères de l'élément parent. Si l'élément parent est dans une taille de caractères prédéfinie, de xx-small à xxx-large, la taille smaller est la taille prédéfinie immédiatement inférieure.
  Si l'élément parent est dans une taille de caractères non prédéfinie, le navigateur calcul la taille smaller en appliquant un coefficient.

• font-size: larger;

  Caractères une taille en dessus de celle des caractères de l'élément parent. La méthode pour déterminer la taille larger est la même que celle utilisée pour smaller.

• font-size: initial;

  La valeur initiale est medium.

• font-size: unset; font-size: inherit;

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

Simulateur.

Compatibilité et prise en charge.

Aucun problème de compatibilité avec la propriété font-size.

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-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-synthesis : Autorise ou non le calcul des styles manquants dans 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.