text-transform
Nekretnina u CSS kontrolira mala slova teksta i slova.
.lowercase ( text-transform: lowercase; )
Vrijednosti transformacije teksta
lowercase
čini sva slova u odabranom tekstu malim slovima.uppercase
čini sva slova u odabranom tekstu velikim slovima.capitalize
velikim slovom stavlja prvo slovo svake riječi u odabranom tekstu.none
ostavlja velika i mala slova teksta onako kako je unesen.inherit
daje tekstu padež i velika slova njegova roditelja.
Demo ispod pokazuje lowercase
, uppercase
te capitalize
u upotrebi. Pogledajte karticu HTML da biste vidjeli kako je tekst izvorno napisan, a zatim se vratite na karticu rezultata da biste je vidjeli nakon primjene CSS-a.
Pogledajte Olovku 0f4293fce0d14aafc3818c950ab0ded3 tvrtke mariemosley (@mariemosley) na CodePenu.
Točke interesa
capitalize
napisat će velikim slovima riječi koje se pojavljuju unutar jednostrukih ili dvostrukih navodnika, a prvo slovo nakon crtice. Prvo slovo nakon broja neće biti napisano velikim početnim slovom, pa se datumi poput "4. veljače 2015." neće transformirati u "4. veljače 2015.".
capitalize
utječe samo na prva slova riječi. To neće promijeniti slučaj ostatka slova u riječi. Na primjer, ako imate capitalize
riječ koja je već u svim velikim slovima, ostala slova u riječi neće se prebaciti na mala slova. To je lijepo kad vaš tekst sadrži kraticu ili kraticu koja ne smije sadržavati mala slova.
CSS ne može napraviti "slučaj velikih slova", stil pisanja velikih slova koji se koristi u naslovima knjiga, filmova, pjesama i pjesama, gdje su članci malim slovima (kao u "Raiders of the Lost Ark"). Ali, postoje JavaScript rješenja za naslove, uključujući toTitleCase () Davida Goucha.
Više informacija
- pretvorba teksta na MDN
- transformacija teksta u specifikaciji W3C
- Bilješke o pristupačnosti velikog teksta s WebAIM-a
Podrška preglednika
Krom | Safari | Firefox | Opera | IE | Android | iOS |
---|---|---|---|---|---|---|
Bilo koji | Bilo koji | Bilo koji | Bilo koji | Bilo koji | Bilo koji | Bilo koji |
Firefox podržava pravila pisanja velikih slova za turske jezike, njemački, nizozemski i grčki koja nisu podržana u drugim preglednicima. Firefox je također jedini preglednik koji podržava text-transform: full-width;
, što može poboljšati čitljivost teksta koji uključuje mješavinu latiničnih i istočnoazijskih skripti. Pogledajte detalje na MDN.