Expresa-la

CSS completou 10 anos existencia este ano! Os que estiveron ao redor por un tempo, gañando o seu pan (ou non) usar o CSS, entón podes conciencia de como temos fame dunha boa selección de fontes. Mesmo coa falta de fontes deseñadores como aqueles en CSS Zen Garden fixeron uso de imaxes de fondo CSS para substituír fontes na procura de facer algunha xustiza ós seus proxectos. Tamén tratamos de Flash / Javascript ® hacks para conseguir os obxectivos do noso proxecto. De maneira ningunha este é un camiño mal para obter as fontes que desexamos nos nosos proxectos de web, pero definitivamente, non é a forma máis conveniente. e ao longo dos anos Deseño Web, coma min, completamente contou con dez ou máis fontes para os seus proxectos.

Desenvolvementos recentes na web estándares e formatos de letra fan posible procesar texto HTML caracteres tipográficos que non sexan as mesmas fontes estándar antigo. Ven no "@ fontface" decleration CSS.

@ Fontface provids unha solución para enlace para o arquivo fonte real e obtela na web. Usando @ fontface, os deseñadores poden usar fontes sen ter que conxelar o texto como imaxes de fondo. A aplicación é moi simple, como se amosa abaixo, pero como todas as cousas boas teñen un papel con-lo, non todos os navegadores soportan un "tipo de letra" única. Se planear usar fontface @ na web con necesidade de apoio cross-browser, entón terá que achegar fontes para varios tipos de font-o mesmo.

1. TrueType - Un formato deseñado para quedar ben na pantalla. Recoméndase especialmente para o Windows navegadores (Chrome).
2. OpenType (CFF) - Este formato é mellor para o traballo de impresión e non sempre quedan ben en Windows.
3. EOT - Debe dese formato se quere dirixir o Internet Explorer. IE non vai utilizar calquera outro formato. O noso EOT serían considerados "Lite", xa que non son nin comprimida nin o dominio restrinxido.
4. SVG - Este é un formato XML soportada por algúns navegadores, incluíndo o iPhone.
5. WOFF - Este cross-browser web-só o formato da fonte, leve (datos da fonte é comprimido) e pode ser feita con TrueType ou PostScript (CFF) describe. Hoxe é soportado por Firefox 3.6 +.

Usando @ fontface

  @ Font cara {
 font-family: "CalligraphyFLFRegular ';
 src: url ('CalligraphyFLF.eot');
 src: local ("CalligraphyFLF '), local (' CalligraphyFLF '), formato de URL (' CalligraphyFLF.woff") ("WOFF '), url (' CalligraphyFLF.ttf ') formato (' TrueType '), url (' CalligraphyFLF . svg # CalligraphyFLF ') formato (' svg ');
 }
 @ Font cara {
   font-family: "O tipo de letra";
   src: url ("fonts / font_filename.eot");
   src: local ("nome alternativo"), lugar ("Alternatename"),
     formato url ("fonts / font_filename.woff") ("WOFF"),
     formato url ("fonts / font_filename.otf") ("OpenType"),
     formato url ("fonts / font_filename.svg # font_filename") ("SVG");
   }
 h2 {font-family: "O tipo de letra", Xeorxia, serif;} 

Como podes ver no exemplo anterior, para incluír o tipo de letra seleccionado, ten de se vincular a un conxunto de fonttypes para o mesmo tipo de letra. De aí a xente se refiren a el como "Kit Orixe".
Hai Vivir fonte dispoñibles que explicitamente permite a conexión co @ propiedade CSS font-face-to-baixo End User License Agreement (EULA).

Recursos útiles WebFont:

• Fontes dispoñibles para @ font-face-embedding páxina wiki en http://webfonts.info/wiki/index.php?title=Main_Page
  
• Ray Larabie . É un deseñador de renome fonte que fixo centos de interesantes fontes TrueType dispoñibles gratuitamente para uso na web. As súas fontes son elegantes, decorativo, e brincalhão.
• Dieter Steffmann é outra gran fonte de deseño. Tamén fixo moitas fontes bonitas dispoñibles para calquera usar.
• Tenda Orixe : ofrece fontes deseñadas especialmente para uso na web. Máis de 30 dos fogares FontFont máis exitosos están agora dispoñibles como FontFonts web. FontShop ten tamén un detallado guía do usuario WebFont http://www.fontshop.com/blog/newsletters/pdf/webfontfontuserguide.pdf
  
• Esquilo Orixe : Vitrinas todas as fontes que Squirrel Font ofrece para o seu uso coa incorporación CSS @ font-face. Esquilo Font ofrece unha cantidade impresionante de tipo, fai que sexa moi sinxelo de elixir un para fóra, e con descanso ofrece "kits" - a fonte da súa elección, en diversos formatos, embalados con demo HTML e CSS usa moito actual sintaxe @ font-face . Eles ofrecen unha forma de facer as súas propias @ font-face kits . Se o tipo de letra que desexa utilizar foi licenciado de forma adecuada (os que veñen co ordenador non son necesariamente así), o xerador produce EOT, SVG e hey! WOFF arquivos.