Erstellt am 25.08.2014, letzte Aktualisierung am 06.09.2014, bereits 276 Lesungen

CSS text-align – Texte ausrichten: mittig, Blocksatz, links, rechts

Mit der CSS Eigenschaft text-align ist es möglich, Texte auszurichten. Ausrichten heißt, an den linken oder rechten Rand, zentriert in der Mitte oder als Blocksatz.

Wie du dies mit CSS machst, erfährst du in diesem CSS Tutorial.

Syntax zu CSS text-align

text-align: right;

Wir können auf jedes Blockelement die text-align anwenden. Diese wirkt sich jedoch nur auf Text aus. Das Ausrichten von Elementen kann man unter anderem mit der CSS float Eigenschaft vornehmen.

Die Besonderheit bei der text-align CSS Eigenschaft ist der Blocksatz.
Alle Buchstaben bekommen dafür einen eigenen Abstand, der bei einer Zeile immer der gleiche ist. Anders als bei CSS letter-spacing, bestimmt CSS/Browser selbst, welchen Abstand jedes Zeichen bekommt, damit: der Text vom linken bis zum rechten Rand voll ausgefüllt wird. Ähnlich wie bei einem Zeitungsartikel.

Wichtig bei der text-align Eigenschaft ist zudem, dass es nur auf Blockelemente angewendet werden kann!

Beispiele für text-align

1. Rechts ausrichten:

text-align: right;

1. Rechts ausgerichteter Text - Beispiel
Dieser Text sollte durch CSS rechts ausgerichtet sein!

2. Mittig ausrichten:

text-align: center;

2. Mittig ausgerichteter Text - Beispiel
Dieser Text sollte durch CSS mittig zentriert ausgerichtet sein!

3. Blocksatz Ausrichtung

text-align: justify;

3. Blocksatz ausgerichteter Text - Beispiel
Dieser Text sollte durch CSS als Blocksatz ausgerichtet sein! Dieser Text sollte durch CSS als Blocksatz ausgerichtet sein! Dieser Text sollte durch CSS als Blocksatz ausgerichtet sein! Dieser Text sollte durch CSS als Blocksatz ausgerichtet sein! Dieser Text sollte durch CSS als Blocksatz ausgerichtet sein!

Informationen und Werte

Vererbbar: ja
Initialwert: im Normal "left" (linksbündig)
Anwendbar: nur auf Blockelemente
Werte: left (Linksbündig), right (rechtsbündig), center (mittig ausrichten), justify (Blocksatz), inherit (Vererbung)

Kommentare « CSS text-align – Texte ausrichten: mittig, Blocksatz, links, rechts »

Webmaster-Glossar.de
Schreib den ersten Kommentar!
grau Gäste gelb Mitglieder

Kommentar verfassen

Name
eMail-Adresse (wird nicht angezeigt)
Webseite (optional)
Info: URL / Namen Keyword-Spam wird gelöscht!
Du kannst als Gast Kommentare verfassen. Für registrierte Mitglieder besteht die Möglichkeit den Kommentarverlauf weiter zu verfolgen.
HTML verwenden:
<code>Code darstellen
<code>Mein Code</code>
Mein Code
<strike>Durchgestrichen
<strike>Mein Text</strike>
Mein Text
<strong>Fettschrift
<strong>Mein Text</strong>
Mein Text
<em>Schrägschrift
<em>Mein Text</em>
Mein Text
<blockquote>Zitat
<blockquote>Mein Text</blockquote>
Mein Text