Alineación de texto CSS
Alineación del texto
La text-alignpropiedad se utiliza para establecer la alineación horizontal de un texto.
Un texto puede estar alineado a la izquierda o a la derecha, centrado o justificado.
El siguiente ejemplo muestra texto alineado al centro y alineado a la izquierda y a la derecha (la alineación a la izquierda es la predeterminada si la dirección del texto es de izquierda a derecha, y la alineación a la derecha es la predeterminada si la dirección del texto es de derecha a izquierda):
Ejemplo
h1 {
text-align: center;
}
h2 {
text-align: left;
}
h3 {
text-align: right;
}
Cuando la text-alignpropiedad se establece en "justificar", cada línea se estira para que cada línea tenga el mismo ancho, y los márgenes izquierdo y derecho son rectos (como en revistas y periódicos):
Ejemplo
div {
text-align: justify;
}
Alinear texto al final
La text-align-lastpropiedad especifica cómo alinear la última línea de un texto.
Ejemplo
Alinee la última línea de texto en tres elementos <p>:
p.a
{
text-align-last: right;
}
p.b
{
text-align-last: center;
}
p.c
{
text-align-last: justify;
}
Dirección del texto
Las propiedades directiony
unicode-bidise pueden usar para cambiar la dirección del texto de un elemento:
Ejemplo
p {
direction: rtl;
unicode-bidi: bidi-override;
}
Alineamiento vertical
La vertical-alignpropiedad establece la alineación vertical de un elemento.
Ejemplo
Establecer la alineación vertical de una imagen en un texto:
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;
}