Alignement du texte CSS
Alignement du texte
La text-align
propriété est utilisée pour définir l'alignement horizontal d'un texte.
Un texte peut être aligné à gauche ou à droite, centré ou justifié.
L'exemple suivant montre un texte aligné au centre, à gauche et à droite (l'alignement à gauche est la valeur par défaut si la direction du texte est de gauche à droite, et l'alignement à droite est la valeur par défaut si la direction du texte est de droite à gauche) :
Exemple
h1 {
text-align: center;
}
h2 {
text-align: left;
}
h3 {
text-align: right;
}
Lorsque la text-align
propriété est définie sur "justifier", chaque ligne est étirée de sorte que chaque ligne ait la même largeur et que les marges gauche et droite soient droites (comme dans les magazines et les journaux) :
Exemple
div {
text-align: justify;
}
Aligner le texte en dernier
La text-align-last
propriété spécifie comment aligner la dernière ligne d'un texte.
Exemple
Alignez la dernière ligne de texte dans trois éléments <p> :
p.a
{
text-align-last: right;
}
p.b
{
text-align-last: center;
}
p.c
{
text-align-last: justify;
}
Sens du texte
Les propriétés direction
et
unicode-bidi
peuvent être utilisées pour changer la direction du texte d'un élément :
Exemple
p {
direction: rtl;
unicode-bidi: bidi-override;
}
Alignement vertical
La vertical-align
propriété définit l'alignement vertical d'un élément.
Exemple
Définir l'alignement vertical d'une image dans un texte :
img.a {
vertical-align: baseline;
}
img.b {
vertical-align: text-top;
}
img.c {
vertical-align:
text-bottom;
}
img.d {
vertical-align: sub;
}
img.e {
vertical-align: super;
}