En CSS 3, La forma en que funciona una @font-face es que cualquiera que sea el atributo que especificas para una regla @font-face, éste no determina cómo luce una fuente sino más bien cuándo es que va a ser utilizada.
A continuación tienes un ejemplo en el que utilizando @font-face se simulan los extra-weight de las fuentes, mediante la asignación de fuentes especÃficas para cada weight.
Por ejemplo, si posees las dos reglas siguientes:
-
@font-face {
-
font-family: newfont;
-
src: local(Arial);
-
font-weight: 200;
-
}
-
@font-face {
-
font-family: newfont;
-
src: local(Calibri);
-
font-weight: 300;
-
}
Entonces, si utilizas font-family "newfont" con weight 200 utilizará Arial, pero si la utilizas con weight 300 implementará Calibri. Asà que podemos tomar ventaja de eso, y dado que usa @font-face ni siquiera debemos preocuparnos acerca de si la computadora del usuario posee la fuente o no.
Fuente: Ajaxian
Viernes, 30 de Octubre de 2009 a las 10.56
Hola. Respecto a ésto, ¿Qué browsers lo soportan?
Viernes, 30 de Octubre de 2009 a las 11.24
Muy buena pregunta. La propiedad @font-face es compatible con Safari 4, Firefox 3.5, Opera 10 e Internet Explorer 6, 7 y 8. Esto para las versiones de Windows. El único browser masivo que no soporta la propiedad es Google Chrome