Prezentace se nahrává, počkejte prosím

Prezentace se nahrává, počkejte prosím

Mgr. Vlastislav Kučera.  připojení fontů z webu (Google fonts)

Podobné prezentace


Prezentace na téma: "Mgr. Vlastislav Kučera.  připojení fontů z webu (Google fonts)"— Transkript prezentace:

1 Mgr. Vlastislav Kučera

2  připojení fontů z webu (Google fonts)

3  definujeme název písma  cesta k souboru s písmem  př.: font-family: nazev-pisma; src: url(cesta-k-souboru) format(format-souboru) }  přiřazení k prvku: ◦.prvek{ font-family: nazev-pisma }

4  několik typů: ◦ woff  Web Open Font Forma  dnes nejčastější formát  podpora IE9+ ◦ ttf/otf  TrueType/OpenType  podpora: všechny moderní prohlížeče, IE9+ ◦ svg  fonty definované ve vektorovém formátu SVG  staré verze iOS Safari ◦ eot  Embedded OpenType font  pro IE8- (IE4 – IE8)

5   EOT:  WOFF:  SVG:  TTF/OTF:  WOFF 2.0:

6   i české  i fonty ve více formátech

7  chceme připojit písmo PECITA, které nalezneme na 5Bterm%5D=PECITA&q%5Bsearch_check%5D= Y 5Bterm%5D=PECITA&q%5Bsearch_check%5D= Y  stáhneme požadované formáty, rozbalíme do složky /fonts (/pismo) webového sídla

8 @font-face{ font-family: Pecita; src: url('../pismo/pecita.eot'); src: url('../pismo/pecita.eot?#iefix'), url('../pismo/pecita.woff') format('woff'), url('../pismo/pecita.ttf') format('truetype'), url('../pismo/pecita.svg') format('svg'); }

9   připojení: ◦ v HTML souboru: ◦ v CSS url(http://fonts.googleapis.com/css?family=Open+ Sans&subset=latin,latin-ext);http://fonts.googleapis.com/css?family=Open+ Sans&subset=latin,latin-ext  odkazování na font:.prvek{font-family: ‘Open Sans’;}


Stáhnout ppt "Mgr. Vlastislav Kučera.  připojení fontů z webu (Google fonts)"

Podobné prezentace


Reklamy Google