CSS, la police de caractères

Ces propriétés permettent de définir l'apparence de la police de caractères du texte.

  • font-family : Liste de polices de caractères utilisées.
  • font-size : Taille de la police.
  • font-style : Style de la police.
  • font-weight : Epaisseur de la police.
  • font : Raccourci regroupant de une ou plusieurs des propriétés dans n'importe quel ordre.

Famille de police de caractère (font-family)

On peut spécifier une ou plusieurs polices, ordonnée par priorités..

Syntaxe

	
/* liste des polices ordonnée par priorité */
font-family : family-name1, family-name2;
	

Exemple

	
font-family : Verdana, Arial, Helvetica, sans-serif;
font-family: Times, "Times New Roman", Georgia, serif;
	

Taille de la police de caractère (font-size)

La taille peut être exprimé en unité relative (em, rem, ex), en unité absolue (px) ou en pourcentage (%).

Syntaxe

	
/* Taille de la police */
font-size : <integer><length>;
font-size : <integer><percentage>;
	

Exemple

	
font-size : 2rem
font-size : 1.2em
	

Style de la police de caractère (font-style)

On ne peut définir qu'un seul style.

Syntaxe

	
/* Style normal (Valeur par défaut) */
font-style: normal;

/* Style italique */
font-style: italic
 
/* Style oblique */
font-style: oblique;
  	

Exemple

	
font-style: normal;
font-style: italic;
font-style: oblique;
	

Epaisseur de la police de caractère (font-weight)

On ne peut définir qu'une seule épaisseur.

Syntaxe

	
/* Epaisseur normal (Valeur par défaut) */
font-weight : normal;

/* Epaisseur grasse */
font-weight : bold;
   	

Exemple

	
font-weight : normal;
font-weight : bold;
	

Regroupement de plusieurs propriétés d'une police de caractère (font)

On peut regrouper plusieurs propriétés dans une seule propriété générique. L'ordre de déclaration des propriétés n'a pas d'importance.

Syntaxe

	
/* Regroupement de propriétés */
font : <font-family> <font-size> <font-style> <font-weight>
	

Exemple

	
font: italic 2em "Open Sans", sans-serif;