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

问题描述

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

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

这在Firefox中很好用，但在Chrome中不行。
inspect element之后，我得到以下消息：

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

资源解释为字体，但是转换为MIME类型application / octet-

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生成器< a>

.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

您还需要一个.htaccess添加以下类型的字体位置：

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

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