CSS - Schreibrichtung

-

Arten von Schreibmodi

Horizontal-tb (Standard)

Der Schreibmodus horizontal-tb ist der Standard in CSS. In diesem Modus fließt der Text horizontal von links nach rechts, und die nächste Zeile erscheint unter der vorherigen. Dies ist üblich für Sprachen, die horizontal geschrieben werden, wie Englisch.

Beispiel-Codeausschnitt

.horizontal-tb {
  writing-mode: horizontal-tb;
}

Vertical-rl

Der Schreibmodus vertical-rl zeigt Text vertikal an, wobei die Zeilen von rechts nach links fließen. Der Text wird um 90 Grad im Uhrzeigersinn gedreht, und die nächste Zeile erscheint links von der vorherigen. Dieser Modus eignet sich für vertikale Navigationsmenüs oder zur Anzeige von Text in Sprachen, die traditionell vertikal geschrieben werden, wie Japanisch oder Chinesisch.

Beispiel-Codeausschnitt

.vertical-rl {
  writing-mode: vertical-rl;
}

Vertical-lr

Der Schreibmodus vertical-lr ähnelt vertical-rl, aber die Zeilen fließen von links nach rechts. Der Text wird um 90 Grad gegen den Uhrzeigersinn gedreht, und die nächste Zeile erscheint rechts von der vorherigen. Dieser Modus kann für vertikale Textlayouts verwendet werden.

Beispiel-Codeausschnitt

.vertical-lr {
  writing-mode: vertical-lr;
}

Sideways-rl

Der Schreibmodus sideways-rl zeigt Text vertikal an, wobei die Zeilen von rechts nach links fließen. Im Gegensatz zu vertical-rl werden die Zeichen nicht gedreht und bleiben aufrecht. Dieser Modus eignet sich für kompakte vertikale Layouts oder kurze vertikale Beschriftungen.

Beispiel-Codeausschnitt

.sideways-rl {
  writing-mode: sideways-rl;
}

Sideways-lr

Der Schreibmodus sideways-lr ähnelt sideways-rl, aber die Zeilen fließen von links nach rechts. Die Zeichen bleiben aufrecht, und die nächste Zeile erscheint rechts von der vorherigen. Dieser Modus kann in bestimmten Designszenarien angewendet werden, die ein kompaktes vertikales Layout benötigen.

Beispiel-Codeausschnitt

.sideways-lr {
  writing-mode: sideways-lr;
}