Styling text · Mise en forme du texte
This page needs a recent browser (with SharedArrayBuffer support). Please update Chrome, Edge, Firefox or Safari to the latest version. · Cette page nécessite un navigateur récent (avec support SharedArrayBuffer). Veuillez mettre à jour Chrome, Edge, Firefox ou Safari vers la dernière version.
English
Sizing text
font-sizesets how big text is, usually in pixels:font-size: 24px;.font-weight: bold;makes text bold (usenormalto undo it).font-family: Georgia;changes the typeface — the style of the letters.
Français
Taille du texte
font-sizedéfinit la taille du texte, généralement en pixels :font-size: 24px;.font-weight: bold;met le texte en gras (utiliseznormalpour annuler).font-family: Georgia;change la police — le style des lettres.
English
Aligning text
text-alignmoves text left, center, or right inside its box.text-align: center;is great for titles.line-height: 1.6;adds space between lines, so paragraphs are easier to read.
Français
Alignement du texte
text-aligndéplace le texte vers la gauche, le centre ou la droite dans sa boîte.text-align: center;est idéal pour les titres.line-height: 1.6;ajoute de l'espace entre les lignes, rendant les paragraphes plus lisibles.
<style>
h1 { font-size: 36px; text-align: center; }
p { font-family: Georgia; line-height: 1.6; }
</style>
<h1>My story</h1>
<p>Once upon a time, on a small website...</p>
English
Common mistakes
font-size,font-weightandtext-aligncontrol text.- Sizes often use
pxorrem.
Français
Erreurs courantes
font-size,font-weightettext-aligncontrôlent le texte.- Les tailles utilisent souvent
pxourem.
English
Now you try
- These properties stack up — one box can have several.
- Resize a heading, then center a paragraph.
Français
À vous maintenant
- Ces propriétés s'empilent — une boîte peut en avoir plusieurs.
- Redimensionnez un titre, puis centrez un paragraphe.
Make the heading bigger. Add h1 { font-size: 40px; }. · Agrandissez le titre. Ajoutez h1 { font-size: 40px; }.
Center the paragraph on the page. Add p { text-align: center; }. · Centrez le paragraphe sur la page. Ajoutez p { text-align: center; }.