Modul de scriere - CSS-Tricks

writing-modeProprietatea schimbă alinierea textului , astfel încât să poată fi citit de sus în jos sau de la stânga la dreapta, în funcție de limba. De exemplu, să presupunem că dorim să adăugăm un text care este citit de sus în jos și de la dreapta la stânga, astfel:

.vertical-rl ( writing-mode: vertical-rl; )

Vedeți modul de scriere Pen: vertical-rl de CSS-Tricks (@ css-tricks) pe CodePen.

Acest lucru este cel mai util în limbi precum chineza, japoneza sau coreeana, unde textul este adesea setat vertical. În limba engleză, este mai probabil să doriți să utilizați această proprietate din motive estetice, cum ar fi alinierea unui titlu într-un bloc de text ca acesta:

Vedeți Penul YWBWGA de CSS-Tricks (@ css-tricks) pe CodePen.

Valori

În exemplele de mai jos am făcut prima literă a textului în roșu, doar pentru a vedea mai ușor ce direcție trebuie să începeți să citiți.

orizontal-tb

Aceasta este valoarea implicită a proprietății: textul este citit de la stânga la dreapta și de sus în jos.

Vedeți modul de scriere Pen: horizontal-tb de CSS-Tricks (@ css-tricks) pe CodePen.

vertical-rl

Textul este citit de la dreapta la stânga și de sus în jos:

Vedeți modul de scriere Pen: vertical-rl de CSS-Tricks (@ css-tricks) pe CodePen.

vertical-lr

Textul este citit de la stânga la dreapta și de sus în jos:

Vedeți modul de scriere Pen: vertical-rl de CSS-Tricks (@ css-tricks) pe CodePen.

Link-uri conexe

Text vertical cu moduri de scriere CSS3
Ahmad Shadeed în modul de scriere

Suport pentru browser

Aceste date de asistență pentru browser provin de la Caniuse, care are mai multe detalii. Un număr indică faptul că browserul acceptă funcția în versiunea respectivă și în sus.