Osnove API-ja Google Font - CSS-triki

Povezava do datotek CSS

V bistvu imate neposredne povezave do datotek CSS na spletnem mestu Google.com. S parametri URL-ja določite, katere pisave želite in katere različice teh pisav.

… 

Ideja: Dodatni omrežni zahtevi se lahko izognete tako, da odprete ta seznam slogi in kopirate in prilepite stvari @ font-face v svoj glavni slog. Toda pozor: Google naredi nekaj uporabniškega agenta, ki voha stvari, da včasih različnim napravam po potrebi servira različne stvari. Če to storite na ta način, vam ne bo koristilo.

CSS

V CSS lahko nato nove pisave poimensko določite za kateri koli element, ki ga želite uporabiti.

body ( font-family: 'Tangerine', 'Inconsolata', 'Droid Sans', serif; font-size: 48px; )

FontLoader

Namesto povezave s CSS lahko uporabite JavaScript FontLoader. Ima prednosti, kot je nadzor bliskavice nestiliziranega besedila (FOUT), in tudi slabosti, na primer dejstvo, da se pisave ne bodo naložile za uporabnike z izklopljenim JavaScriptom.

 WebFont.load(( google: ( families: ('Cantarell') ) )); .wf-loading h1 ( visibility: hidden; ) .wf-active h1, .wf-inactive h1 ( visibility: visible; font-family: 'Cantarell'; ) 

Ta imena razredov se npr. .wf-loadingUporabijo za element. Torej, ko se pisave "nalagajo", lahko to ime razreda uporabite za skrivanje besedila. Potem, ko so prikazani, jih znova naredite vidne. Tako se nadzoruje FOUT.