Teksti orientatsioon - CSS-trikid

text-orientationVara CSS reastab teksti line töötamisel vertikaalne writing-mode. Põhimõtteliselt pöörab see kas joont 90 ° päripäeva, et aidata reguleerida vertikaalsete keelte kuvamist - umbes nii, nagu text-combine-uprightvertikaalses skriptis tekstireas tähemärkide rühmade pööramine, kuid täielike tekstiridade puhul.

.element ( text-orientation: mixed; writing-mode: vertical-rl; )

Kahesuunalise teksti - näiteks nii vasakult paremale kui ka paremalt vasakule teksti - haldamiseks vaadake unicode-bidivara. See on ühendatud directionatribuudiga, et alistada, kuidas brauser otsustab teksti kuvada.

Süntaks

text-orientation: mixed | upright | sideways

Esialgne: mixed
Kehtib kõigi elementide kohta, välja arvatud tabeliridade rühmad, read, veerugrupid ja veerud
Päritud: jah
Protsendid: n / a
Arvutatud väärtus: määratud väärtus
Animatsiooni tüüp: pole animeeritav

Väärtused

/* Keyword values */ text-orientation: mixed; /* default */ text-orientation: upright; text-orientation: sideways; text-orientation: sideways-right; /* Global values */ text-orientation: inherit; text-orientation: initial; /* mixed */ text-orientation: unset;

mixed: Vaikeväärtus. Horisontaalse skripti tähemärki pööratakse 90 ° päripäeva. Vertikaalse skripti tähemärgid kuvatakse nende loomulikus vertikaalses asendis.
upright: Horisontaalses skriptis olevad tähemärgid on paigutatud loomulikus horisontaalses püstiasendis, sealhulgas mõned tähestikud. Niisiis, kui vertikaalse kirjutamise režiim võib tekstirida pöörata nii, et märgid oleksid külgsuunas, pöörab see väärtus tähemärgid ise 90 ° nende loomulikku asendisse. Pange tähele, et see väärtus sunnib directionatribuudi kasutatud väärtuseks ltr, mis tähendab, et kõiki märke käsitletakse nii, nagu oleksid need vasakult paremale kirjutamise režiimis.
sideways: Kogu vertikaalse kirjutusrežiimi tekst kuvatakse külgsuunas, nagu oleks see horisontaalses paigutuses, kuid kogu rida pööratakse 90 ° päripäeva.
sideways-right: Mõned brauserid peavad seda väärtust pseudonüümiks sidewaysväärtusele, mida säilitatakse tagurpidi ühilduvuse tagamiseks.

use-glyph-orientationeemaldati märksõna väärtusena 2015. aasta detsembris. Seda kasutati SVG elementidel SVG omaduste määratlemiseks glyph-orientation-verticalja glyph-orientation-horizontalneed on nüüdseks aegunud. glyph-orientation-verticalon nüüd varjunimi text-orientation.

Brauseri tugi

Need brauseri tugiandmed pärinevad Caniuse'ilt, millel on üksikasjalikum teave. Number näitab, et brauser toetab selle versiooni ja uuemat funktsiooni.

Töölaud

Chrome	Firefox	IE	Edge	Safari
48	41	Ei	79	10,1 *

Mobiil / tahvelarvuti

Android Chrome	Android Firefox	Android	iOS-i Safari
88	85	81	10,0-10,2

Spetsifikatsioon

CSS-i kirjutamisrežiimid, tase 3 (toimetaja mustand)

Rohkem informatsiooni

Miks on teksti vertikaalne orienteerumine brauserite ühilduvuse õudusunenägu? Nikhil - põhjalik selgitus text-orientationja writing-mode.
Lihtsalt külgsuunas teksti loomine Adi Purdila CSS-i atribuudi CSS abil - uurige lisaks kasutamisele ka erinevaid lähenemisviise text-orientation.
2 viisi vertikaalse teksti loomiseks CSS-is WS Toh poolt - otsesem võrdlus lähenemisviisi writing-modeja abil text-orientation.
Tekst Rotation Chris Coyier - põhimõte, et teksti vertikaalse kasutades transformasemel writing-modevõi text-orientation.