Основе АПИ-ја Гоогле Фонт - ЦСС-трикови

Anonim

Линк до ЦСС датотека

У основи имате директну везу до ЦСС датотека на Гоогле.цом. Кроз параметре УРЛ-а одређујете које фонтове желите и које варијације тих фонтова.

…
Идеја: Можете избећи додатни мрежни захтев отварањем тог листа стилова и копирањем и лепљењем @ фонт-фаце ствари у свој главни табелу стилова. Али пазите: Гоогле ради неке информације које агент корисника њушка како би понекад служио различите ствари различитим уређајима по потреби. Ако то учините на овај начин, нећете имати користи од тога.

ЦСС

Затим у свом ЦСС-у можете навести нове фонтове по имену на било ком елементу који желите да их користите.

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

ФонтЛоадер

Можете користити ЈаваСцрипт ФонтЛоадер уместо да се повежете са ЦСС-ом. Има предности, попут управљања блицем нестилног текста (ФОУТ), а такође и недостатке, попут чињенице да се фонтови неће учитати за кориснике са искљученим ЈаваСцриптом.

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

Та имена класа, нпр. .wf-loadingПримењују се на елемент. Дакле, приметите када се фонтови „учитавају“, можете користити то име класе да бисте сакрили текст. Затим, када се прикажу, учините их поново видљивим. Тако се контролише ФОУТ.