5

我对字体真棒有一个非常奇怪的问题。

长话短说：浏览器忽略了@font-face 的“src”部分，并且没有对实际字体提出任何请求。

//font-awesome.css excerpt

@font-face {
    font-family: 'FontAwesome';
    src: url('/Content/fonts/fontawesome-webfont.eot?v=4.0.3');
    src: url('/Content/fonts/fontawesome-webfont.eot?#iefix&v=4.0.3') format('embedded-opentype'), url('/Content/fonts/fontawesome-webfont.woff?v=4.0.3') format('woff'), url('/Content/fonts/fontawesome-webfont.ttf?v=4.0.3') format('truetype'), url('/Content/fonts/fontawesome-webfont.svg?v=4.0.3#fontawesomeregular') format('svg');
    font-weight: normal;
    font-style: normal;
}
  • 所有软件和库都是最新的稳定版本。
  • 控制台没有错误。
  • 直接请求时，字体文件完全可以下载
  • 在 Chrome、FireFox 和 IE 中测试
  • 我的另一个使用以前主要版本的 bootstrap 和 font-awesome 的项目工作正常

http://jsfiddle.net/c2zUh

4

3 回答 3

9

您的 HTML 没有引用图标的基类（设置字体）。您需要包含基类，然后包含图标，即

<span class="glyphicon glyphicon-asterisk"></span>

不是

<span class="glyphicon-asterisk"></span>

和

<i class="fa fa-group"></i>

不是

<i class="fa-group"></i>

你还需要 glyphicon 和 fa 类

并且作为说明，如果您不使用实际应用于元素的样式规则（@font-face 不计算在内）中的字体，则不会请求它。因此，除非元素具有 glyphicon 或 fa 类，否则不会下载相关的字体文件。我必须承认，这对我来说是个新闻。

于 2013-11-11T00:02:18.253 回答
0

尝试在 IIS 中打开您的站点，然后转到“属性”>“HTTP 标头”>“MIME 类型”。对于以下各项，添加一个新的 MIME 类型：

扩展名：.otf

MIME 类型：字体/otf

-

扩展名：.svg

MIME 类型：图像/svg+xml

-

扩展名：.woff

MIME 类型：应用程序/x-font-woff

让我知道这是否会产生盲目的影响！

于 2013-11-10T22:48:14.270 回答
0

您还可以尝试以 woff 格式嵌入字体 - 就在 base64 的 .css 文件中。它在所有浏览器和 IE 9+ 中都能完美运行

此外，可能是这样的情况，您的系统中已经安装了这种字体，这会阻止下载......

于 2013-11-10T22:54:03.363 回答