Táto vlastnosť nám poskytuje kontrolu nad pokročilými typografickými nastaveniami, ako sú malé čiapky, ligatúry a znaky typu swash. Ak ich chcete aktivovať, musíte v úvodzovkách deklarovať, ktorú hodnotu potrebujete, a potom musí nasledovať buď 1
alebo on
povoliť. Prípadne, môžete ich vypnúť buď 0
alebo off
:
.element ( /* these two values do the same thing */ font-feature-settings: "liga" 1; font-feature-settings: "liga1" on; )
font-feature-settings
Vlastnosť podporuje mnoho ďalších hodnôt okrem štandardných ligatúr , vrátane malých písmen:
.element ( font-feature-settings: "smcp" 1; )
Hodnoty
Toto je zoznam všetkých hodnôt, ktoré podporuje font-feature-settings
, ale predtým, ako ich vyskúšate, nezabudnite skontrolovať, ktoré webové písmo, ktoré používate, podporuje aj tieto hodnoty:
liga
: štandardné ligatúrydlig
: diskrečné ligatúryonum
: postavy v starom štýlelnum
: čísla podšívkytnum
: tabuľkové obrázkyzero
: lomítko nulafrac
: zlomkysups
: horný indexsubs
: dolný indexsmcp
: malé čiapkyc2sc
: malé veľké písmená od veľkých písmencase
: formuláre citlivé na veľké a malé písmenáhlig
: historické ligatúrycalt
: kontextové alternatívyswsh
: ozdobyhist
: historické formyss**
: slohové súborykern
: vyrovnanie párovlocl
: lokalizované formulárerlig
: požadované ligatúrymedi
: mediálne formyinit
: počiatočné formuláreisol
: izolované formyfina
: konečné formymark
: označiťmkmk
umiestnenie značky po značke
Kombinácia viacerých nastavení
Ak chcete pridať viac funkcií, musíte nasledovať jednu hodnotu za druhou v zozname oddelenom čiarkami, napríklad takto:
.element ( font-feature-settings:"smcp" 1, "onum" 1; )
Predpony
Ak chcete získať najlepšiu podporu v celom spektre prehľadávačov, použite tieto predvoľby:
.element ( -webkit-font-feature-settings: "smcp" 1; -moz-font-feature-settings: "smcp" 1; -ms-font-feature-settings: "smcp" 1; font-feature-settings: "smcp" 1; )
Podpora prehliadača
Údaje o podpore tohto prehľadávača sú od spoločnosti Caniuse, ktorá obsahuje viac podrobností. Číslo označuje, že prehliadač podporuje túto funkciu v danej verzii alebo vyššej.
Desktop
Chrome | Firefox | IE | Hrana | Safari |
---|---|---|---|---|
21 * | 15 * | 10 | 12 | 9.1 |
Mobil / tablet
Android Chrome | Android Firefox | Android | iOS Safari |
---|---|---|---|
88 | 85 | 4,4 * | 9.3 |
Viac informácií
- Typotheque: Funkcie OpenType vo webových prehľadávačoch - Testy
- W3C
- MDN
- Pieskovisko CSS3 Richarda Ruttera