客户网站上的@font-face无法工作？

Question

这是CSS代码

@font-face {
    font-family: 'FuturaStdBook';
    src: url('site/font-face/futurastd-medium-webfont.eot');
    src: local('☺'), url('site/font-face/futurastd-medium-webfont.woff') format('woff'), url('site/font-face/futurastd-medium-webfont.ttf') format('truetype'), url('site/font-face/futurastd-medium-webfont.svg#webfont') format('svg');
    font-weight: normal;
    font-style: normal;
}

h2 {font-family:'FuturaStdBook', sans-serif}

这是否与MIME类型有关？

如何确保我的路径正确？

- Jitendra Vyas

---

获取的 MIME 类型是什么？在哪个操作系统上使用哪个浏览器？ - Pekka

我们是否必须为所有字体文件扩展名提供MIME类型支持？ - Jitendra Vyas

你确定客户端机器上没有安装名为 '☺' 的字体吗？抱歉，我忍不住了。 - Boldewyn

这几乎肯定不是与 MIME 类型相关的问题，主要因为任何字体格式都没有注册的 MIME 类型。这就是 CSS 规范中 format('') 的主要原因。 - Boldewyn

Answer 1

如果您正在使用IIS，则需要为 .eot 扩展名注册 MIME 类型。

1. 在 IIS 管理器中，打开 MIME 类型配置。
2. 在“操作”下，单击“添加...”。
3. 在扩展框中输入 .otf，在 MIME 类型框中输入 application/octet-stream。
4. 单击“确定”。

您需要为每个非标准扩展名执行此操作（.ttf 已经注册，.woff 没有注册），但这应该就可以了！

- Daniel Schaffer

---

我上周刚刚经历了这个问题... IIS不知道如何提供该文件，因此请求最终只会得到404错误。 - Daniel Schaffer

Answer 2

尝试使用Font Squirrel来获取自定义字体的CSS声明，以确保其兼容性更好。

- Tim Hettler

Answer 3

问题出在你的字体声明中font-weight和font-style的定义上。由于h2元素默认以粗体显示，因此这些元素不会考虑字体声明（因为浏览器认为字体文件仅适用于普通字重，这很可能是正确的）。

解决方案：您需要第二个带有font-weight: bold的字体声明或者将h2元素设置为font-weight:normal和font-style: normal。

- Boldewyn

---

你使用Firebug吗？如果是，那么在“网络”选项卡中，字体是否被下载？它是正确的URL吗？ - Boldewyn

...那么响应头是什么？您可以相应地更新您的问题以帮助找到答案。 - Boldewyn

由于h2元素默认以粗体定义，因此字体规则不适用于这些元素" ... 这完全不正确。任何使用更具体选择器（或相同特定性，但在原始选择器之后定义）定义的规则都将覆盖任何“默认”规则。 "默认"规则只是随浏览器一起提供的样式表。即使覆盖规则设置了相同的样式，这仍然适用。样式不会因为与另一个样式相同而被忽略。 - Daniel Schaffer

@DanielSchaffer 除了我6年前把“规则”和“声明”搞混之外，你还想告诉我什么？如果他在他的h2上设置了font-family，那么在所有浏览器中计算出的font-weight仍然是bold。一个定义其字体为font-weight:normal的@font-face将在所有兼容的浏览器中被忽略。这正是我在我的答案中所说的。 - Boldewyn

不要紧，评论很好。但是如果以“这完全不正确”开头，相比于“帮我发现错误，但我认为...”，你可能会得到一些强烈的回应。☺ - Boldewyn