Allineamento del testo CSS
Allineamento del testo
La text-align
proprietà viene utilizzata per impostare l'allineamento orizzontale di un testo.
Un testo può essere allineato a sinistra oa destra, centrato o giustificato.
L'esempio seguente mostra il testo allineato al centro e allineato a sinistra e a destra (l'allineamento a sinistra è predefinito se la direzione del testo è da sinistra a destra e l'allineamento a destra è predefinito se la direzione del testo è da destra a sinistra):
Esempio
h1 {
text-align: center;
}
h2 {
text-align: left;
}
h3 {
text-align: right;
}
Quando la text-align
proprietà è impostata su "justify", ogni linea viene allungata in modo che ogni linea abbia la stessa larghezza e i margini sinistro e destro siano diritti (come in riviste e giornali):
Esempio
div {
text-align: justify;
}
Allinea testo per ultimo
La text-align-last
proprietà specifica come allineare l'ultima riga di un testo.
Esempio
Allinea l'ultima riga di testo in tre elementi <p>:
p.a
{
text-align-last: right;
}
p.b
{
text-align-last: center;
}
p.c
{
text-align-last: justify;
}
Direzione del testo
Le proprietà direction
e
unicode-bidi
possono essere utilizzate per modificare la direzione del testo di un elemento:
Esempio
p {
direction: rtl;
unicode-bidi: bidi-override;
}
Allineamento verticale
La vertical-align
proprietà imposta l'allineamento verticale di un elemento.
Esempio
Imposta l'allineamento verticale di un'immagine in un testo:
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;
}