Ilmaista sitä

CSS valmistui 10 vuotta olemassaolon tänä vuonna! Ne, jotka ovat olleet jo jonkin aikaa, ansaita leipänsä (tai ei) CSS, niin saatat tietää miten olemme nälkää hyvä valikoima fontteja. Vaikka puute fonttien suunnittelijoiden kaltaisissa CSS Zen Garden on käyttänyt CSS taustakuvia korvata kirjasimet harjoittamisesta tekee joitakin oikeutta niiden mallit. Olemme myös yrittäneet Flash / JavaScript ® hakata saavuttaa suunnittelun tavoitteita. Missään tämä on väärä tapa saada fontit haluamme osaksi Web-malleja, mutta ehdottomasti ei ole halutuin tapa. ja yli vuoden web designer, kuten minä, ovat täysin luottaa kymmenkunta fontit niiden malleja.

Viimeaikainen kehitys web-standardien ja fontin formaatit mahdollistavat tehdä HTML tekstin kirjasimet muuta kuin samaa vanhaa oletus fontteja. Tulee "@ fontface" CSS decleration.

@ Fontface provids ratkaisu linkittää todellista fontin tiedosto ja hakea sitä verkosta. Käyttämällä @ fontface, suunnittelijat voivat käyttää fontteja ilman jäädyttää tekstin taustakuvina. Täytäntöönpano on hyvin suoraviivainen, kuten alla, mutta kaikki hyvät asiat ovat CON osa sitä, kaikki selaimet eivät tue single "fontti". Jos aiot käyttää @ fontface on sivusto vaatii risti selain tukee, niin joudut antamaan lähteitä eri font-tyyppisiä saman.

1. TrueType - formaatti on suunniteltu näyttämään hyvältä ruudulla. Suositellaan erityisesti Windows selaimilla (Chrome).
2. OpenType (CFF) - Tämä formaatti on parempi tulostaa työn ja ​​ei aina näytä hyvältä Windows.
3. EOT - Tarvitset tätä muotoa, jos haluat kohdistaa Internet Explorer. IE ei käytä mihinkään muuhun muotoon. Meidän EOT: n katsottaisiin "Lite", koska ne eivät ole pakattuja eikä domain-rajoitettu.
4. SVG - Tämä on XML-muotoa tukevat jotkut selaimet kuten iPhone.
5. WOFF - Tämä cross-selain, web vain fontin on kevyt (fontti data on zip-pakattu), ja voidaan kääntää joko TrueType-tai PostScript (CFF) linjaa. Se on tällä hetkellä tue Firefox 3.6 +.

Käyttämällä @ fontface

 @ Font-face {font-family: "CalligraphyFLFRegular" src: url ('CalligraphyFLF.eot'); src: paikallinen ('CalligraphyFLF), paikallinen (' CalligraphyFLF), url ('CalligraphyFLF.woff)-muodossa ( "woff '), url (' CalligraphyFLF.ttf)-muodossa (TrueType), url ('CalligraphyFLF.svg # CalligraphyFLF)-muodossa (SVG);} @ font-face {font-family:" Your kirjasin "src: url (" fonts / font_filename.eot "), src: paikallinen (" Alternate name "), paikallinen (" Alternatename "), url (" fonts / font_filename.woff ") muodossa (" woff "), url ("fonts / font_filename.otf") muodossa ("OpenType"), url ("fonts / font_filename.svg # font_filename") muodossa ("SVG");} h2 {font-family: "Your kirjasinlajia" Georgia-serif ;} 

Kuten näette yllä esimerkiksi sisällyttää valitun fontin kirjasinlajin, täytyy linkittää joukko fonttypes samaa kirjasintyyppiä. Siksi ihmiset kutsuvat sitä "Font Kit".
On Font Sarjat että nimenomaisesti sallitaan yhdistäminen kanssa CSS @ font-face omaisuutta sille loppukäyttäjän lisenssi (EULA).

Hyödyllisiä WebFont Resurssit:

• Fonttia @ font-face upottamisen wikisivu osoitteessa http://webfonts.info/wiki/index.php?title=Main_Page
  
• Ray Larabie . Hän on tunnettu fontin suunnittelija, joka on tehnyt satoja mielenkiintoisia TrueType vapaasti käytettävissä verkossa. Hänen fontit ovat tyylikäs, koristeellinen, ja leikkisä.
• Dieter Steffmann on toinen suuri fontti suunnittelija. Hänkin on tehnyt monia kauniita fonttia kenen tahansa käytettävissä.
• Font kauppa : tarjolla fontit on suunniteltu nimenomaan web-käyttöön. Yli 30 menestyneimmistä FontFont perheet ovat nyt saatavissa Web FontFonts. FontShop on myös yksityiskohtainen WebFont käyttäjän opas http://www.fontshop.com/blog/newsletters/pdf/webfontfontuserguide.pdf
  
• Font Orava : Vitriinit kaikki fontit Font Orava tarjoaa käytettäväksi @ font-face CSS upottamisen. Font Orava on vaikuttava määrä tyyppiä, tekee kuolleet helppo valita yksi, ja kätevästi tarjolla "sarjat" - fontilla valinta, eri formaateissa pakattu demo HTML & CSS, joka käyttää hyvin nykyiset @ font-face syntaksia . Ne tarjoavat myös tapa tehdä oman @ font-face sarjat . Jos kirjasintyypin haluat käyttää on lisensoitu asianmukaisesti (ne, jotka tulevat tietokoneen eivät ole välttämättä kunnossa), generaattori tuottaa raskaat, SVG ja hei! WOFF tiedostoja.