De eigenschap text-align-last
De eigenschap text-align-last bepaalt
de uitlijning van de laatste regel tekst: aan de
linkerkant, aan de rechterkant, in het midden, of
zowel aan de linker- als rechterkant tegelijk (uitvullen).
Let op: als een element
(bijvoorbeeld een alinea) slechts één regel bevat,
dan wordt deze regel tegelijkertijd als de eerste en
laatste beschouwd en zal de uitlijning zijn zoals
ingesteld in text-align-last, en niet
zoals in text-align.
Syntaxis
cssselector {
text-align-last: center | left | right | justify | auto | start | end;
}
Waarden
| Waarde | Beschrijving |
|---|---|
center |
In het midden. |
left |
Aan de linkerkant. |
right |
Aan de rechterkant. |
justify |
Zowel aan de rechterkant als aan de linkerkant (uitvullen). |
auto |
Verandert de uitlijning van het element niet. |
start |
Gelijk aan left als de tekst van links naar rechts loopt en right,
wanneer de tekst van rechts naar links loopt (bijvoorbeeld Arabisch).
|
end |
Gelijk aan right als de tekst van links naar rechts loopt en left,
wanneer de tekst van rechts naar links loopt.
|
inherit |
Erft de waarde van de ouder. |
Standaardwaarde: auto.
Voorbeeld . Waarde left
html<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>cssp {
text-align: justify;
text-align-last: left;
}
Результат:
Voorbeeld . Waarde right
html<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>cssp {
text-align: justify;
text-align-last: right;
}
Результат:
Voorbeeld . Waarde center
html<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>cssp {
text-align: justify;
text-align-last: center;
}
Результат:
Voorbeeld . Waarde justify
html<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>cssp {
text-align: justify;
text-align-last: justify;
}
Результат: