Font-face с неправильным типом MIME в Chrome

Ответ 1

Как обычно, разные браузеры имеют разные потребности. Вот кросс-браузерная декларация @fontface, взятая из Paul Irish blog -

@font-face {
  font-family: 'Graublau Web';
  src: url('GraublauWeb.eot');
  src: local('☺'),
         url('GraublauWeb.woff') format('woff'), url('GraublauWeb.ttf') format('truetype');
}

.Это для IE, остальные браузеры используют либо .woff, либо .ttf Если вам нужно создать разные типы из исходного шрифта, вы можете использовать Font Squirrel font-face generator

Кроме того, вам необходимо использовать .htaccess для расположения шрифтов, добавляющих следующие типы:

AddType application/vnd.ms-fontobject .eot
AddType font/ttf .ttf
AddType font/otf .otf
AddType application/x-font-woff .woff

Ответ 2

Вы можете игнорировать предупреждение и можете захотеть рассмотреть этот пост по теме Правильный тип MIME для шрифтов

Также упоминается следующее:

"Примечание. Поскольку для TrueType, OpenType не определены определенные типы MIME, и WOFF, тип MIME указанного файла не является считается".

источник: http://developer.mozilla.org/en/css/@font-face

Ответ 3

Ваши файлы шрифтов не переносятся с соответствующим типом MIME. Это проблема конфигурации веб-сервера, которая может быть легко исправлена.

Для nginx объедините это с существующими типами config, обычно находящимися в каталоге /etc/nginx:

types {
    application/vnd.ms-fontobject    eot;
    application/x-font-woff    woff;
    font/otf    otf;
    font/ttf    ttf;
}

Для Apache добавьте эти строки в .htaccess, найденные в корневом документе:

AddType application/vnd.ms-fontobject .eot
AddType font/ttf .ttf
AddType font/otf .otf
AddType application/x-font-woff .woff

Ответ 4

если вы можете редактировать файл .htaccess, попробуйте добавить

addType font/ttf .ttf

иначе вы могли бы использовать шрифт svg/svgz вместо

Ответ 5

Если вы запустите сервер с nodeJS, это хороший модуль для сопоставления типов mime

https://github.com/broofa/node-mime