Alignement du texte

Fait partie de la section Styling with CSS du Journey HTML de Coddy — leçon 21 sur 76.

En CSS, la propriété text-align est utilisée pour contrôler l'alignement horizontal du texte au sein d'un élément HTML.

Les valeurs courantes pour text-align incluent :

left : Aligne le texte à gauche. C'est l'alignement par défaut pour la plupart des textes.

right: Aligne le texte à droite.
center: Centre le texte horizontalement à l'intérieur de l'élément.

Par exemple :

p {
    text-align: left;
}

h1 {
    text-align: center;
}

.right-align {
    text-align: right;
}

Défi

Facile

On vous donne un document HTML avec un titre (<h1>), un paragraphe (<p>) et une division (<div>). Votre tâche consiste à utiliser la propriété text-align pour styliser ces éléments. Suivez les étapes ci-dessous :

Écrivez une règle CSS qui cible l'élément <h1>. Définissez le text-align sur center.
Écrivez une règle CSS qui cible l'élément <p>. Définissez le text-align sur right.
Écrivez une règle CSS qui cible l'élément <div>. Définissez le text-align sur left.

Aide-mémoire

La propriété text-align contrôle l'alignement horizontal du texte à l'intérieur d'un élément.

Valeurs courantes :

left : Aligne le texte à gauche (par défaut)
right : Aligne le texte à droite
center : Centre le texte horizontalement

p {
    text-align: left;
}

h1 {
    text-align: center;
}

.right-align {
    text-align: right;
}

Essayez vous-même

<html>
<head>
    <title>Text Alignment</title>
    <style>
        /* Write CSS rules here */
    </style>
</head>
<body>
    <h1>This is a heading. </h1>
    <p>This is a paragraph.</p>
    <div>This is a division. </div>
</body>
</html>