Apprendre Techniques de Mise en Forme du Texte pour la Lisibilité

line-height

line-height contrôle l'espacement vertical entre les lignes de texte. Les navigateurs définissent une valeur par défaut basée sur la police, mais vous pouvez la personnaliser en utilisant plusieurs formats :

line-height: multiplier | value in px | value in em | percent

multiplier valeur sans unité comme 1.5 multiplie la font-size ;
value in px hauteur spécifique, par exemple, 24px ;
value in em valeur relative, similaire au multiplicateur (1.4em = font-size × 1.4) ;
percent fonctionne comme le multiplicateur (120% = font-size × 1.2).

index.html

styles.css

Résultat

letter-spacing

letter-spacing définit l'espacement horizontal entre les caractères.

letter-spacing: normal | value in px | value in em

normal : espacement par défaut ;
value in px : espacement supplémentaire fixe ;
value in em : espacement relatif à la font-size.

index.html

styles.css

Résultat

word-spacing

La propriété word-spacing ajuste la distance entre les mots.

word-spacing: value | inherit | normal

value : espacement personnalisé ;
inherit : utilise l'espacement de l’élément parent ;
normal : espacement par défaut.

index.html

styles.css

Résultat

text-shadow

text-shadow ajoute des ombres au texte. Cette propriété accepte quatre valeurs :

text-shadow: "X set" | "Y set" | "blur radius" | "color"

X set : décalage horizontal ;
Y set : décalage vertical ;
blur radius : douceur de l’ombre (0 = net) ;
color : toute couleur valide, par défaut la couleur actuelle du texte.

index.html

styles.css

Résultat

Remarque

En matière de mise en forme du texte, il n’existe pas de règles strictes imposant l’utilisation de certaines valeurs dans des situations spécifiques. Le choix des propriétés et des valeurs de formatage du texte dépend des exigences particulières de chaque projet et de la vision du design.

1. Quelle propriété CSS est utilisée pour créer un effet visuel qui ajoute une ombre au texte ?

2. Quelle propriété CSS permet d’ajuster la distance entre les mots dans un texte ?

Tout était clair ?

Merci pour vos commentaires !

Section 2. Chapitre 2

Demandez à l'IA

Posez n'importe quelle question ou essayez l'une des questions suggérées pour commencer notre discussion

Glissez pour afficher le menu

line-height

line-height: multiplier | value in px | value in em | percent

multiplier valeur sans unité comme 1.5 multiplie la font-size ;
value in px hauteur spécifique, par exemple, 24px ;
value in em valeur relative, similaire au multiplicateur (1.4em = font-size × 1.4) ;
percent fonctionne comme le multiplicateur (120% = font-size × 1.2).

index.html

styles.css

Résultat

letter-spacing

letter-spacing définit l'espacement horizontal entre les caractères.

letter-spacing: normal | value in px | value in em

normal : espacement par défaut ;
value in px : espacement supplémentaire fixe ;
value in em : espacement relatif à la font-size.

index.html

styles.css

Résultat

word-spacing

La propriété word-spacing ajuste la distance entre les mots.

word-spacing: value | inherit | normal

value : espacement personnalisé ;
inherit : utilise l'espacement de l’élément parent ;
normal : espacement par défaut.

index.html

styles.css

Résultat

text-shadow

text-shadow ajoute des ombres au texte. Cette propriété accepte quatre valeurs :

text-shadow: "X set" | "Y set" | "blur radius" | "color"

X set : décalage horizontal ;
Y set : décalage vertical ;
blur radius : douceur de l’ombre (0 = net) ;
color : toute couleur valide, par défaut la couleur actuelle du texte.

index.html

styles.css

Résultat

Remarque

1. Quelle propriété CSS est utilisée pour créer un effet visuel qui ajoute une ombre au texte ?

2. Quelle propriété CSS permet d’ajuster la distance entre les mots dans un texte ?

Tout était clair ?

Merci pour vos commentaires !

Section 2. Chapitre 2