2.7.2 Horizontale Textausrichtung <text-align>

a) Bezeichnungen

• text-align = text alignment = Textausrichtung

b) Möglichkeiten

Mit "text-align:..." kann man Textinhalte von Block-Elementen ausrichten.
Folgende Angaben sind möglich:

• left = linksbündig ausrichten (Voreinstellung)
• center = zentriert ausrichten.
• right = rechtsbündig ausrichten.
• justify = als Blocksatz ausrichten.

c) Beispiel 1: Links Ausrichten von Text und Trennstrich mit align="left"

<p>Text und Strich sind links</p>
<hr width="100" align="left">

Text und Strich sind links

---

d) Beispiel 2: Zentrieren von Text und Trennstrich mit align="center"

<p align="center">Text und Strich sind zentriert</p>
<hrwidth="200" align="center">

Text und Strich sind zentriert

---

e) Beispiel 3: Rechts Ausrichten von Text und Trennstrich mit align="right"

<p align="right">Text und Strich sind 
rechts ausgerichtet</p>
<hr width="350" align="right">

Text und Strich sind rechts ausgerichtet

---

f) Beispiel 4: Blocksatz

<p align="justify">Blocksatz</p>

Text asfasdfsdf asdf asdfasdfasf asdf asdf a sdf asd f asdf a sdf asd f asdf as df sadf s adf sadf s df asdf sa df sad fa sdf asd f sf sdfa sdf asdf sad fas dfa sdf asdfasdf asdf sa d ff asdfasdasdfsd fasd f asdf s df asd f asdf asdf as df sad fund Strich sind rechts ausgerichtet

f) Workshops

• SELFHTML: text-align (horizontale Ausrichtung)
  SELFHTML: Beispiel

• SELFHTML: Textabsätze ausrichten
  SELFHTML: Beispiel

• W3Schools: Beispiel: CSS - Align the text

• Web Design Group: Syntax: text-align

↑