Dieser Inhalt wurde automatisch aus dem Englischen übersetzt, und kann Fehler enthalten. Erfahre mehr über dieses Experiment.

View in English Always switch to English

Grid-Achsen

Das CSS-Grid-Layout ist eine zweidimensionale Layoutmethode, die es ermöglicht, Inhalte in Zeilen und Spalten anzuordnen. Daher gibt es in jedem Grid zwei Achsen: die Block- oder Spaltenachse und die Inline- oder Zeilenachse.

Entlang dieser Achsen können Elemente mit den in der Box-Ausrichtungsspezifikation definierten Eigenschaften ausgerichtet und gerechtfertigt werden.

Die Inline-Achse (auch Zeilenachse oder Hauptachse genannt) ist die Richtung, in der normaler Text fließt. Die Blockachse (auch Spaltenachse oder Kreuzachse genannt) wird verwendet, wenn Textblöcke angeordnet werden. Die physische Richtung dieser Achsen kann sich je nach Schreibmodus des Dokuments ändern.

Zum Beispiel, wenn Sie von links nach rechts, von oben nach unten schreiben (wie bei typischem englischen Prosatext), dann werden die einzelnen Zeichen entlang der Inline-Achse angeordnet, die von links nach rechts verläuft.

Diagramm zeigt die Inline-Achse im CSS-Grid-Layout.

Und wenn der Text mehrere Zeilen enthält, werden diese Zeilen entlang der Blockachse platziert, die von oben nach unten verläuft.

Diagramm zeigt die Blockachse im CSS-Grid-Layout.