Internet Explorer 11 e fontes Web suportadas

Estou a usar um tipo de letra TTF e OTF para apanhar todos os navegadores principais (FireFox, Chrome e IE11) na maioria dos dispositivos. Tudo parece bem, antes de relocalização para o servidor de produção e, em seguida, IE não quer mostrar meus ícones.

Acho que os cérebros de Redmond têm alguma característica para impedir que isto funcione na Internet, por isso só funciona a partir de localhost.

O que se passa aqui? Que tipo de tipo de letra eu preciso usar para IE?

Author: Alex.K., 2014-05-30

2 answers

Esta é a forma normal de carregar com @font-face, correcções hacky e tudo -

@font-face {
    font-family: 'MyWebFont';
    src: url('webfont.eot'); /* IE9 Compat Modes */
    src: url('webfont.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('webfont.woff') format('woff'), /* Modern Browsers */
         url('webfont.ttf')  format('truetype'), /* Safari, Android, iOS */
         url('webfont.svg#svgFontName') format('svg'); /* Legacy iOS */
    }
Por favor, verifique as tabelas de compatibilidade para suporte de EOT, verifique estas ligações -

Relação 1

Relação 2

 9
Author: Rohit Suthar, 2014-05-30 13:02:19

Esteja ciente de uma coisa:
Os tipos de letra não irão funcionar no IE se o item família de tipos de letra no css tiver um nome diferente do nome do tipo de letra! Este bug me levou o dia todo para descobrir e pode ser muito frustrante se você não está ciente disso!

Para o IE 6-11, use fontes EOT, mas tenha em atenção que não é suportado por qualquer outro navegador.

Para IE > = 9 & todos os outros navegadores, use fontes woff, uma vez que tem o maior suporte e a melhor compressão, uma vez que foi projetado especificamente para o site.

Como tal:

@font-face {
    font-family: 'FontName';
    src: url('FontName.eot');  /* IE 9 - 11 */
    src: url('FontName.eot?#iefix') format('embedded-opentype'), /* IE Fix for IE 6-8*/
         url('FontName.woff') format('woff'); /* IE 9-11 & All Modern Browsers */
}
 5
Author: beliha, 2017-10-03 09:54:48