text-transformOmaisuus CSS ohjaa tekstin tapauksen ja arvo.
.lowercase ( text-transform: lowercase; )Tekstin muunnosarvot
lowercasetekee kaikki valitun tekstin kirjaimet pieniksi.uppercasetekee kaikista valitun tekstin kirjaimista isoja.capitalizeisoin kirjaimin valitun tekstin jokaisen sanan ensimmäinen kirjain.nonejättää tekstin kirjainkoon ja isot kirjaimet täsmälleen samalla tavalla kuin ne kirjoitettiin.inheritantaa tekstille vanhemman kirjaimet ja isot kirjaimet.
Demo esitetään lowercase, uppercaseja capitalizekäytössä. Katso HTML-välilehti nähdäksesi, miten teksti kirjoitettiin alun perin, ja siirry sitten takaisin Tulokset-välilehteen nähdäksesi sen CSS: n käyttöönoton jälkeen.
Katso Mariemosleyn (@mariemosley) kynä 0F4293fce0d14aafc3818c950ab0ded3 CodePenistä.
Kiinnostavat paikat
capitalizeisoilla kirjaimilla sanat, jotka esiintyvät yksittäisissä tai kaksoislainausmerkeissä, ja yhdysmerkin ensimmäinen kirjain. Se ei isoa isoa numeron jälkeistä ensimmäistä kirjainta, joten päivämäärät, kuten “4. helmikuuta 2015”, eivät muutu ”4. helmikuuta 2015”.
capitalizevaikuttaa vain sanojen ensimmäisiin kirjaimiin. Se ei muuta sanan muiden kirjainten kirjainkokoa. Esimerkiksi, jos olet capitalizesana, joka on jo kirjoitettu isoilla kirjaimilla, sanan muut kirjaimet eivät vaihda pieniksi. Tämä on mukavaa, kun teksti sisältää lyhenteen tai lyhenteen, joka ei saisi sisältää pieniä kirjaimia.
CSS ei voi tehdä nimikirjaa, isojen kirjainten tyyliä, jota käytetään kirjojen, elokuvien, kappaleiden ja runojen otsikoissa, joissa artikkelit ovat pieniä (kuten "Kadonneen arkin raidat"). Mutta otsikkotapauksessa on JavaScript-ratkaisuja, mukaan lukien David Gouchin toTitleCase ().
Lisää tietoa
- tekstimuunnos MDN: ssä
- tekstimuunnos W3C Spec
- Huomautuksia isojen kirjainten saatavuudesta WebAIMista
Selaimen tuki
| Kromi | Safari | Firefox | Ooppera | IE | Android | iOS |
|---|---|---|---|---|---|---|
| Minkä tahansa | Minkä tahansa | Minkä tahansa | Minkä tahansa | Minkä tahansa | Minkä tahansa | Minkä tahansa |
Firefox tukee kielikohtaisia isojen kirjainten sääntöjä turkkilaisille kielille, saksalle, hollannille ja kreikalle, joita muut selaimet eivät tue. Firefox on myös ainoa tuettu selain text-transform: full-width;, joka voi auttaa parantamaan latinalaisten ja itäaasialaisten komentosarjojen sekoitusta sisältävän tekstin luettavuutta. Katso yksityiskohdat MDN: ltä.