ttf - load local fonts css

Font Face no funciona en IE8 como se esperaba

Question

¡He usado el siguiente código para obtener una fuente personalizada en mi sitio web! usando el siguiente código!

@font-face{
font-family:portagolTC;
src: url(../font/PortagoITC_TT.woff?) format(''woff'');
src: url(../font/PortagoITC_TT.eot?#iefix) format(''opentype'');
}

Esto funciona en chrome, ff, IE10, IE9 pero no en IE8. ¿Qué estoy haciendo mal aquí? Por favor corrígeme si estoy haciendo algo mal.

Nota: Busqué en Google y encontré pocas respuestas de stackoverflow pero nada parece resolver mi problema.

CSS3111: @font-face encountered unknown error.
PortagoITC_TT.woff
CSS3114: @font-face failed OpenType embedding permission check. Permission must be Installable.
PortagoITC_TT.ttf
CSS3114: @font-face failed OpenType embedding permission check. Permission must be Installable.
PortagoITC_TT.ttf

Answer 1

Aunque mi empresa compró la fuente, todos los formatos (eot, woff, etc.), no funcionó en IE8 e IE10. Cargué el formato ttf a http://www.fontsquirrel.com/tools/webfont-generator y obtuve un ''webfont''? versión y ahora funciona!

Debería haber visto la consola antes de IE, hay problemas de permiossion declarados.

Answer 2

Tuve problemas con IE8 y no tuve ningún mensaje de error de consola . Lo que resolvió mi problema fue alterar ligeramente mi código de @font-face :

Antes de:

@font-face {
font-family: "Hero";
src: local("Hero"),
url("../fonts/Hero.eot?"),
url("../fonts/Hero.woff") format("woff"),
url("../fonts/Hero.ttf") format("truetype"),
url("../fonts/Hero.svg#Hero") format("svg");
font-weight: normal;
font-style: normal;
}

Después:

@font-face {
font-family: "Hero";
src: url("../fonts/Hero.eot"); /* this line made the difference */
src: local("Hero"),
url("../fonts/Hero.eot?"),
url("../fonts/Hero.woff") format("woff"),
url("../fonts/Hero.ttf") format("truetype"),
url("../fonts/Hero.svg#Hero") format("svg");
font-weight: normal;
font-style: normal;
}

Answer 3

Si IE8 arroja el CSS3111: @font-face encountered unknown error , es probable que tenga el problema de que no coincida con el nombre de la familia de fuentes .

Para resolver esto, necesita editar su archivo de fuente, definir nombres idénticos para Fontname, Family Name y Name for humans y exportar su TTF. Esto se puede hacer usando la aplicación FontForge . Luego, usted lo vuelve a convertir para web (EOT, WOFF).

Más información: http://fontface.codeandmore.com/blog/ie-7-8-error-with-eot-css3111/

Actualizar

Lo hizo funcionar descargando una versión propia de la fuente TTF y la convirtió para web. El CSS que utilicé:

@font-face {
font-family: ''portagoitc-tt'';
src: url(''fonts/portagoitc-tt.eot'');
src: url(''fonts/portagoitc-tt.eot?iefix'') format(''opentype''),
url(''fonts/portagoitc-tt.woff'') format(''woff''),
url(''fonts/portagoitc-tt.ttf'') format(''truetype'');
font-weight: normal;
font-style: normal;
}