HTML Text ausrichten: rechtsbündig & linksbündig

Dies ist die Standardeinstellung in HTML. Um Text explizit linksbündig auszurichten, benötigst du keine speziellen Attribute.

So richtest du Text in HTML aus:

Linksbündige Ausrichtung:

Beispiel:

<p>Dies ist ein linksbündiger Text.</p>

Rechtsbündige Ausrichtung:

Es gibt zwei Möglichkeiten, Text in HTML rechtsbündig auszurichten:

Mit dem Attribut align:

Verwende das Attribut align im entsprechenden Tag (z.B. <p>, <div>) und setze den Wert auf "right".

Beispiel:

<p align="right">Dies ist ein rechtsbündiger Text.</p>

Mit CSS:

Verwende die CSS-Eigenschaft text-align und setze den Wert auf "right". Dies ist die modernere und flexiblere Methode.

Beispiel:

p {
  text-align: right;
}

Zentrierte Ausrichtung:

Um Text zu zentrieren, verwende entweder das Attribut align mit dem Wert "center" oder die CSS-Eigenschaft text-align mit dem Wert "center".

Beispiel (align):

<p align="center">Dies ist ein zentrierter Text.</p>

Beispiel (CSS):

p {
  text-align: center;
}

Blocksatz:

Beim Blocksatz wird der Text an beiden Rändern ausgerichtet, wodurch gerade Zeilen entstehen. Dies kann mit der CSS-Eigenschaft text-align und dem Wert "justify" erreicht werden.

Beispiel:

p {
  text-align: justify;
}

Was bedeuted was?

• Linksbündig: Der Text beginnt am linken Rand des Containers und endet an einer ungeraden rechten Kante.
• Rechtsbündig: Der Text beginnt an einer ungeraden linken Kante und endet am rechten Rand des Containers.
• Zentriert: Der Text befindet sich in der horizontalen Mitte des Containers.
• Blocksatz: Der Text wird an beiden Rändern des Containers ausgerichtet, wodurch gerade Zeilen entstehen.

Tipp: Es ist generell empfehlenswert, CSS anstelle des Attributs align zu verwenden, da CSS flexibler und zukunftssicherer ist.

Zusätzliche Informationen:

• Die Ausrichtung von Text kann auch auf Zeilenebene mit den CSS-Eigenschaften text-align-left, text-align-center und text-align-right gesteuert werden.
• Mit CSS-Flexbox und CSS-Grid lassen sich noch komplexere Layouts für die Textausrichtung erstellen.

Ich hoffe, diese Erklärung hilft dir weiter!

Über mich

Domi

Hi ich bin’s Dominik. Auf Blogseite.com findest du alles was mich interessiert. Mag Games, liebe SEO, programmiere gerne und möchte dir mit verschiedenen Themen die mich begeistern einen Mehrwert liefern. Viel Spaß auf meiner Seite