Les feuilles de styles CSS
DEUXIÈME PARTIE
80
Cet exemple fait afficher au navigateur le texte : « TOTO EST MON AMI »… même
si la structure de base reste en minuscules. Il ne s’agit donc que d’un effet visuel.
Les styles et effets sur les mots et paragraphes
Interlignage de texte
L’interligne est l’espace séparant deux lignes consécutives d’un paragraphe (à ne pas
confondre avec les marges de paragraphe, qui ne portent que sur son périmètre). Les
paragraphes et autres éléments contenant du texte ont une valeur d’interligne par
défaut qui dépend des navigateurs. Elle est d’environ 1,2 em, soit un peu plus que la
hauteur d’un caractère.
La propriété CSS mettant en place l’interligne s’appelle line-height. Elle admet
pour valeurs un nombre, un pourcentage, ou le mot-clé normal. Toutes les unités
sont acceptées ; « em » est toutefois conseillée. L’exemple suivant génère ainsi un bloc
de paragraphe de 10 caractères de large sur fond vert et en interligne double :
Le crénage
Le crénage (ou interlettrage) est la distance séparant deux caractères consécutifs.
Toutes les balises disposent d’une valeur de crénage par défaut, qu’on peut modifier
grâce à la propriété CSS letter-spacing (une valeur négative ayant pour effet de
resserrer les caractères).
HTML
CSS
.interligne {
line-height: 2em;
width: 10em;
background-color: green;
}
HTML
DEUXIÈME PARTIE
80
Cet exemple fait afficher au navigateur le texte : « TOTO EST MON AMI »… même
si la structure de base reste en minuscules. Il ne s’agit donc que d’un effet visuel.
Les styles et effets sur les mots et paragraphes
Interlignage de texte
L’interligne est l’espace séparant deux lignes consécutives d’un paragraphe (à ne pas
confondre avec les marges de paragraphe, qui ne portent que sur son périmètre). Les
paragraphes et autres éléments contenant du texte ont une valeur d’interligne par
défaut qui dépend des navigateurs. Elle est d’environ 1,2 em, soit un peu plus que la
hauteur d’un caractère.
La propriété CSS mettant en place l’interligne s’appelle line-height. Elle admet
pour valeurs un nombre, un pourcentage, ou le mot-clé normal. Toutes les unités
sont acceptées ; « em » est toutefois conseillée. L’exemple suivant génère ainsi un bloc
de paragraphe de 10 caractères de large sur fond vert et en interligne double :
Le crénage
Le crénage (ou interlettrage) est la distance séparant deux caractères consécutifs.
Toutes les balises disposent d’une valeur de crénage par défaut, qu’on peut modifier
grâce à la propriété CSS letter-spacing (une valeur négative ayant pour effet de
resserrer les caractères).
HTML
toto est mon ami
CSS
.interligne {
line-height: 2em;
width: 10em;
background-color: green;
}
HTML
Test de paragraphe pour montrer la hauteur de
l'interligne fixé à 2 em, soit le double de la hauteur de caractère.
