Propiedad text-align-last
La propiedad text-align-last establece
la alineación de la última línea de texto: a la
izquierda, a la derecha, al centro, o justificada
(alineada tanto a la izquierda como a la derecha simultáneamente).
Tenga en cuenta que si en un elemento
(por ejemplo, un párrafo) hay solo una línea,
entonces se considera tanto la primera como la
última línea y su alineación será la
especificada en text-align-last, y no
la de text-align.
Sintaxis
selector {
text-align-last: center | left | right | justify | auto | start | end;
}
Valores
| Valor | Descripción |
|---|---|
center |
Centrado. |
left |
A la izquierda. |
right |
A la derecha. |
justify |
Justificado (alineado tanto al margen izquierdo como al derecho). |
auto |
No altera la alineación del elemento. |
start |
Equivale a left si el texto fluye de izquierda a derecha y a right
cuando el texto fluye de derecha a izquierda (como en árabe, etc.).
|
end |
Equivale a right si el texto fluye de izquierda a derecha y a left
cuando el texto fluye de derecha a izquierda.
|
inherit |
Hereda el valor del elemento padre. |
Valor por defecto: auto.
Ejemplo . Valor left
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elitorire
aenean a dapibus magna, ac interdum nisl. Suspendisse egetil
fringilla nibh, eu commodo arcu. Donec lacinia tempor velite
sed tincidunt. Aliquam porttitor nulla purus, vel vulputater
ipsum faucibus sed. Phasellus sodales, lorem vel cursus vehi
ante purus lacini dui, interdum fringilla massa eros ut duir.
</p>
<p>
Lorem ipsum dolor sit amet.
</p>
p {
text-align: justify;
text-align-last: left;
}
:
Ejemplo . Valor right
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elitorire
aenean a dapibus magna, ac interdum nisl. Suspendisse egetil
fringilla nibh, eu commodo arcu. Donec lacinia tempor velite
sed tincidunt. Aliquam porttitor nulla purus, vel vulputater
ipsum faucibus sed. Phasellus sodales, lorem vel cursus vehi
ante purus lacini dui, interdum fringilla massa eros ut duir.
</p>
<p>
Lorem ipsum dolor sit amet.
</p>
p {
text-align: justify;
text-align-last: right;
}
:
Ejemplo . Valor center
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elitorire
aenean a dapibus magna, ac interdum nisl. Suspendisse egetil
fringilla nibh, eu commodo arcu. Donec lacinia tempor velite
sed tincidunt. Aliquam porttitor nulla purus, vel vulputater
ipsum faucibus sed. Phasellus sodales, lorem vel cursus vehi
ante purus lacini dui, interdum fringilla massa eros ut duir.
</p>
<p>
Lorem ipsum dolor sit amet.
</p>
p {
text-align: justify;
text-align-last: center;
}
:
Ejemplo . Valor justify
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elitorire
aenean a dapibus magna, ac interdum nisl. Suspendisse egetil
fringilla nibh, eu commodo arcu. Donec lacinia tempor velite
sed tincidunt. Aliquam porttitor nulla purus, vel vulputater
ipsum faucibus sed. Phasellus sodales, lorem vel cursus vehi
ante purus lacini dui, interdum fringilla massa eros ut duir.
</p>
<p>
Lorem ipsum dolor sit amet.
</p>
p {
text-align: justify;
text-align-last: justify;
}
: