Textausrichtung - CSS-Tricks | CSS-Almanach 2025

Die text-justifyEigenschaft in CSS ist eine Ergänzung zu der text-alignEigenschaft, mit der die Ausrichtungsmethode für Text festgelegt wird, wenn text-alignder justifyWert festgelegt ist.

p ( text-align: justify; text-justify: inter-word; )

Werte

inter-word: Gibt an, dass Text durch Anpassen des Wortabstands gerechtfertigt ist, wodurch effektiv ein zusätzlicher Wortabstand erstellt wird. Dies ist effektiv eine Variation der word-spacingEigenschaft.
inter-character: Gibt an, dass Text durch Anpassen des Zeichenabstands gerechtfertigt ist, wodurch effektiv ein zusätzlicher Zeichenabstand erstellt wird. Dies ist effektiv eine Variation der letter-spacingEigenschaft.
auto: Ermöglicht dem Browser zu bestimmen, ob die Rechtfertigung besser als inter-wordoder behandelt wird inter-character. Dies kann in mehrsprachigen Szenarien hilfreich sein, in denen die Inhaltssprache bis zum Rendern unbekannt ist, sodass der Browser-Benutzeragent entsprechend auswählen kann, welche Methode besser zum Sprachkontext passt.
none: Deaktiviert Rechtfertigungsmethoden, entfernt effektiv alle Rechtfertigungsmöglichkeiten oder überschreibt, wo eine Rechtfertigungsmethode in der Kaskade auftreten kann.

Was genau ist Rechtfertigung?

Begründeter Text ist eine ausgefallene Art zu sagen, wie Text das Feld ausfüllt, in dem er enthalten ist. Möglicherweise kennen Sie den Rechtfertigungstext bereits gut und wissen ihn nicht einmal. Wenn Sie jemals Textbearbeitungssoftware wie Word und Google Text & Tabellen verwendet haben, sind Sie möglicherweise mit den folgenden Symbolen vertraut:

Optionen zum Ausrichten und Ausrichten von Text in der Google Text & Tabellen-Symbolleiste

Diese ersten drei legen die Textausrichtung fest, genau wie die CSS- text-alignEigenschaft, bei der der Text nach links, rechts oder vollständig zentriert ausgerichtet werden kann.

Dieses vierte Symbol ist die Option zum Ausrichten und weist den Inhalt an, die gesamte Breite des Dokuments auszufüllen, sodass jede Zeile bis zum Rand bündig ist, unabhängig davon, ob sie den Abstand zwischen Wörtern beeinflusst.

Durch das Ausrichten von Inhalten in Google Text & Tabellen wird der Abstand zwischen den Wörtern erhöht, um die volle Dokumentbreite in jeder Zeile zu belegen

Die text-justifyEigenschaft ermöglicht es uns, dasselbe zu tun, jedoch mit zusätzlicher Flexibilität, um zu bestimmen, ob die Abstandsmethode, die zum Begründen des Inhalts verwendet wird, zwischen Wörtern oder Zeichen verwaltet wird.

Browser-Unterstützung

Die text-justifyEigenschaft ist in der Spezifikation des CSS-Textmoduls der Stufe 3 enthalten, die sich zum Zeitpunkt des Schreibens derzeit im Entwurfsstatus des Herausgebers befindet.

Diese Immobilie ist derzeit als „gefährdet“ eingestuft, im Zeitraum der Kandidatenempfehlung fallen gelassen zu werden. Daher wird nicht empfohlen, diese Eigenschaft in der Produktion zu verwenden, da es unwahrscheinlich ist, dass sie in naher Zukunft in allen Browsern als Standard übernommen wird.

Die derzeitige Unterstützung ist auf Firefox 55+ beschränkt. Internet Explorer 11 und Edge 14+ unterstützen ebenfalls die Eigenschaft, jedoch nur den inter-wordWert sowie inoffizielle Werte, die nicht in der W3C-Spezifikation enthalten sind.

Diese Browser-Unterstützungsdaten stammen von Caniuse, das detaillierter ist. Eine Zahl gibt an, dass der Browser die Funktion ab dieser Version unterstützt.