Postavke značajke fonta - CSS-trikovi

Anonim

Ovo nam svojstvo daje kontrolu nad naprednim tipografskim postavkama kao što su male kape, ligature i crte. Da biste ih aktivirali, morate u navodnicima navesti koja vam je vrijednost potrebna, a zatim slijedeće 1ili onza omogućavanje. Alternativno ih možete onemogućiti s bilo 0ili off:

.element ( /* these two values do the same thing */ font-feature-settings: "liga" 1; font-feature-settings: "liga1" on; )

font-feature-settingsSvojstvo podržava mnoge druge vrijednosti, osim standardnih ligatura , uključujući male početne slova:

.element ( font-feature-settings: "smcp" 1; )

Vrijednosti

Ovo je popis svih vrijednosti koje podržavaju font-feature-settings, ali prije nego što ih isprobate, provjerite podržava li i web font koji koristite podržavaju ove vrijednosti:

  • liga: standardne ligature
  • dlig: diskrecijske ligature
  • onum: figure u starom stilu
  • lnum: figure obloga
  • tnum: tablični brojevi
  • zero: iskošena nula
  • frac: razlomci
  • sups: natpis
  • subs: indeks
  • smcp: male kape
  • c2sc: mali glavni gradovi iz glavnih gradova
  • case: oblici osjetljivi na velika i mala slova
  • hlig: povijesne ligature
  • calt: kontekstualne zamjenice
  • swsh: crte
  • hist: povijesni oblici
  • ss**: stilski setovi
  • kern: kerning
  • locl: lokalizirani oblici
  • rlig: potrebne ligature
  • medi: medijalni oblici
  • init: početni oblici
  • isol: izolirani oblici
  • fina: završni oblici
  • mark: oznaka
  • mkmk pozicioniranje marke u marku

Kombinirajući više postavki

Da biste dodali više značajki, morate slijediti jednu vrijednost za drugom na popisu odvojenom zarezima, na primjer:

.element ( font-feature-settings:"smcp" 1, "onum" 1; )

Prefiksi

Da biste dobili najbolju podršku u čitavom spektru preglednika, upotrijebite ove prefikse:

.element ( -webkit-font-feature-settings: "smcp" 1; -moz-font-feature-settings: "smcp" 1; -ms-font-feature-settings: "smcp" 1; font-feature-settings: "smcp" 1; )

Podrška preglednika

Podaci o podršci preglednika potječu iz tvrtke Caniuse, koja sadrži više detalja. Broj označava da preglednik podržava značajku u toj verziji i novijoj.

Radna površina

Krom Firefox IE Rub Safari
21 * 15 * 10 12 9.1

Mobitel / tablet

Android Chrome Android Firefox Android iOS Safari
88 85 4,4 * 9.3

Više informacija

  • Tipoteka: Značajke OpenType u web preglednicima - testovi
  • W3C
  • MDN
  • CSS3 Sandbox Richarda Ruttera