Propriété line-height de CSS

Définition et utilisation

L'attribut line-height définit la distance entre les lignes (hauteur de ligne).

Remarque :Les valeurs négatives ne sont pas autorisées.

Description

Cette propriété affecte le layout des boîtes de ligne. Lorsqu'elle est appliquée à un élément en bloc, elle définit la distance minimale entre les lignes de base de cet élément, plutôt que la distance maximale.

La différence entre la valeur calculée de line-height et la valeur de font-size (dans CSS, appelée espacement des lignes) est divisée en deux moitiés, ajoutées respectivement au sommet et au bas du contenu d'une ligne de texte. La plus petite boîte qui peut contenir ces contenus est la boîte de ligne.

La valeur numérique originale spécifie un facteur de mise à l'échelle, les éléments descendants héritent de ce facteur de mise à l'échelle plutôt que de la valeur calculée.

Veuillez également consulter :

Tutoriel CSS :Texte CSS

Manuel de référence HTML DOM :Propriété lineHeight

Exemple

Définir l'hauteur de ligne en pourcentage :

p.small {line-height:90%}
p.big {line-height:200%}

Essayez-le vous-même

（Vous pouvez voir d'autres exemples en bas de la page）

Syntaxe CSS

line-height: normal|number|length|initial|inherit;

Valeur de l'attribut

Valeur Description
normal Par défaut. Définir un espacement des lignes raisonnable.
number Définir un nombre, ce nombre sera multiplié par la taille actuelle de la police pour définir l'espacement des lignes.
length Définir un espacement des lignes fixe.
% Pourcentage de l'espacement des lignes basé sur la taille actuelle de la police.
inherit Définit que la valeur de l'attribut line-height doit être héritée de l'élément parent.

Détails techniques

Valeur par défaut : normal
Héritabilité : yes
Version : CSS1
Syntaxe JavaScript : object.style.lineHeight="2"

Exemple TIY

Définir l'espacement des lignes avec un pourcentage
cet exemple montre comment utiliser un pourcentage pour définir l'espacement des lignes dans un paragraphe.
Définir l'espacement des lignes avec une valeur en pixels
cet exemple montre comment utiliser une valeur en pixels pour définir l'espacement des lignes dans un paragraphe.
Définir l'espacement des lignes avec un nombre
cet exemple montre comment utiliser un nombre pour définir l'espacement des lignes dans un paragraphe.

Support du navigateur

Les nombres dans le tableau indiquent la version du navigateur la première à prendre en charge cette propriété.

Chrome IE / Edge Firefox Safari Opera
1.0 4.0 1.0 1.0 7.0