Pregunta Font Face no funciona en IE8 como se esperaba


¡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

9
2017-10-03 05:38


origen


Respuestas:


Si IE8 arroja el CSS3111: @font-face encountered unknown error, probablemente tengas el nombre de familia de fuente no coincidente problema.

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 el FontForge solicitud. 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;
}

17
2017-10-03 08:35



Tuve problemas con IE8 y tuve sin mensajes de error de la consola. Lo que resolvió mi problema fue alterar mi @font-face código ligeramente

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;
}

3
2017-11-27 18:49



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.


2
2017-11-08 10:14