IE отказывается интерпретировать правило @font-face, даже если сначала указан файл eot, а затем "src: local('☺'), ..."

Question

Я много читал об этом, пробовал много разных вещей, и до сих пор не играю в кости. Вот пример одного из моих правил @font-face:

@font-face { 
    src: url('/lib/fonts/Museo/Museo500-Regular.eot'); 
    src: local("☺"), 
        url('/lib/fonts/Museo/Museo500-Regular.ttf') format('opentype'); 
    font-family: Museo; 
    font-weight: 500; 
}

Я проверил свои пути и попробовал различные CSS, и ничто не заставит шрифты отображаться в IE. Вот пример страницы, которая использует все пользовательские шрифты одновременно:

http://test.thenewhive.com/test/fonts

Это выглядит хорошо во всех других браузерах.

Answer 1

Я не знаю, действительно ли это как-то связано с вашей проблемой IE, но format('opentype') часть здесь неправильна, так как ваш файл TTF является файлом TrueType. Так должно быть format('truetype').

При этом я настоятельно рекомендую вам использовать что-то вроде генератора Font Squirrel @font-face, чтобы предотвратить любую ошибку. http://www.fontsquirrel.com/fontface/generator

Если вы предпочитаете делать это вручную, я советую вам взглянуть на эту статью: http://readableweb.com/new-font-face-syntax-simpler-easier/ он отлично объясняет правильный синтаксис, просто убедитесь, что вы все прочитали, так как в оригинальном посте были обновления.