Chrome 中 MIME 类型错误的字体 [英] font-face with wrong MIME type in Chrome

问题描述

这是我使用的 @font-face 声明:

This is the @font-face declaration I have used:

@font-face {
    font-family: SolaimanLipi;
    src: url("font/SolaimanLipi_20-04-07.ttf");
}

这在 Firefox 中可以完美运行，但在 Chrome 中却不能.在检查元素"之后，我收到以下消息:

This is working perfectly in Firefox but not in Chrome. After "inspect element" I got the following message:

资源被解释为字体但使用 MIME 类型 application/octet-stream 传输.

Resource interpreted as font but transferred with MIME type application/octet-stream.

任何建议将不胜感激.

推荐答案

像往常一样，不同的浏览器有不同的需求.这是一个跨浏览器 @fontface 声明，摘自 Paul Irish 博客 -

As usual, different browsers have different needs. Here is a cross browser @fontface declaration, taken from the 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');
}

.eot 适用于 IE，其余浏览器使用 .woff 或 .ttf如果您需要从源字体生成不同的类型，您可以使用 Font Squirrel 的 font-face generator

.eot is for IE, the rest of the browsers use either .woff or .ttf If you need to generate the different types from the source font, you can use Font Squirrel's font-face generator

您还需要通过 .ht 访问添加以下类型的字体位置:

You also need to an .htaccess to the location of the fonts adding the following types:

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

这篇关于Chrome 中 MIME 类型错误的字体的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！