A writing-modetulajdonság megváltoztatja a szöveg igazítását, hogy a nyelvtől függően felülről lefelé vagy balról jobbra olvasható legyen. Tegyük fel például, hogy hozzá akarunk adni néhány szöveget, amely felülről lefelé és jobbról balra olvasható, így:
.vertical-rl ( writing-mode: vertical-rl; )Lásd a CSS-Tricks (@ css-tricks) tollal történő írásmódját: vertical-rl a CodePen-en.
Ez a leghasznosabb olyan nyelveken, mint a kínai, japán vagy koreai, ahol a szöveg gyakran függőlegesen van beállítva. Angol nyelven valószínűbb, hogy ezt a tulajdonságot esztétikai okokból szeretné használni, például egy fejléc igazításához egy ilyen szövegtömbben:
Lásd a Pen YWBWGA by CSS-Tricks (@ css-tricks) szolgáltatást a CodePen-en.
Értékek
Az alábbi példákban a szöveg első betűjét pirosra tettem, csak így könnyebben láthatja, hogy melyik irányba kell elkezdenie olvasni.
vízszintes-tb
Ez a tulajdonság alapértelmezett értéke: a szöveget balról jobbra és felülről lefelé olvassák.
Lásd a CSS-Tricks (@ css-tricks) tollal történő írásmódját: horizontal-tb a CodePen-en.
függőleges-rl
A szöveg jobbról balra és felülről lefelé olvasható:
Lásd a CSS-Tricks (@ css-tricks) tollal történő írásmódját: vertical-rl a CodePen-en.
függőleges-lr
A szöveg balról jobbra és felülről lefelé olvasható:
Lásd a CSS-Tricks (@ css-tricks) tollal történő írásmódját: vertical-rl a CodePen-en.
Kapcsolódó linkek
- Függőleges szöveg CSS3 írási módokkal
- Ahmad Shadeed írásmódban
Böngésző támogatás
Ez a böngésző támogatási adat a Caniuse cégtől származik, amely részletesebben szerepel. Egy szám azt jelzi, hogy a böngésző támogatja az adott és újabb verziók szolgáltatásait.
Asztal
| Króm | Firefox | AZAZ | Él | Szafari |
|---|---|---|---|---|
| 8 * | 41 | 11. | 12. | 5,1 * |
Mobil / Tablet
| Android Chrome | Android Firefox | Android | iOS Safari |
|---|---|---|---|
| 88 | 85 | 3 * | 5,0–5,1 * |