CSS-Textausrichtung

Textausrichtung

text-align Diese Eigenschaft wird verwendet, um die horizontale Ausrichtung des Texts zu setzen.

Der Text kann linksbündig, rechtsbündig oder zentriert sein.

Das folgende Beispiel zeigt zentrierte und linksbündige Textausrichtung (wenn der Textfluss von links nach rechts ist, ist dies die Standardausrichtung; wenn der Textfluss von rechts nach links ist, ist dies die Standardausrichtung rechts):

Beispiel

h1 {
  text-align: center;
}
h2 {
  text-align: left;
}
h3 {
  text-align: right;
}

Versuchen Sie es selbst

wenn text-align Wenn die Eigenschaft auf "justify" gesetzt wird, wird jede Zeile gestreckt, um jede Zeile eine gleiche Breite zu haben und die Seitenränder sind gerade (wie in Zeitschriften und Zeitungen):

Beispiel

div {
  text-align: justify;
}

Versuchen Sie es selbst

Textrichtung

direction und unicode-bidi Eigenschaft kann verwendet werden, um die Textrichtung des Elements zu ändern:

Beispiel

p {
  direction: rtl;
  unicode-bidi: bidi-override;
}

Versuchen Sie es selbst

Vertikale Ausrichtung

vertical-align Eigenschaft legt die vertikale Ausrichtung des Elements fest.

Dieser Beispiel zeigt, wie Sie die vertikale Ausrichtung von Bildern im Text einstellen können:

Beispiel

img.top {
  vertical-align: top;
}
img.middle {
  vertical-align: middle;
}
img.bottom {
  vertical-align: bottom;
}

Versuchen Sie es selbst