字体不能在现场工作答案

【问题标题】：font-face not working in live字体不能在现场工作
【发布时间】：2013-02-26 16:44:47
【问题描述】：

使用@font-face 我尝试为我的网页使用一些字体。 font-face 在本地主机中工作正常。当我尝试移动它以使字体在任何浏览器中都不起作用时。这是我的代码：

@font-face{
font-family: lucida;
src: url('../fonts/lucida.ttf');
}
.header{
 font-family:lucida;
}

当我喜欢它时，它在 localhost 中可以正常工作，但在 live 中却不行。

注意：我的字体在 fonts 文件夹中，css 在 css 文件夹中

【问题讨论】：

你能发送一个链接到你的网站吗？大多数情况下是文件丢失或路径错误
html.wemagination.net
试图直接转到字体文件给我一个 500 错误：html.wemagination.net/fonts/lucida.tff您确定将文件移动到您的实时服务器吗？
也许服务器日志会给你更多关于 500 错误的信息。
我在尝试直接访问文件时收到“错误 500”，但我可以在开发者工具的 Chrome 资源面板中看到字体。需要注意的是，理想的网络字体应该是.woff 格式，而不是标准的.ttf。

【解决方案1】：

也许这会有所帮助： Font-Face Not loaded

这可能与在 IIS 中允许服务器上的字体类型有关。

另外，我认为 Firefox 存在一个错误，即字体文件需要与 CSS 文件位于同一文件夹中。

【讨论】：

刚刚注意到@Jrod 对这个问题的评论。我的回答无关紧要，因为您收到 500 内部服务器错误。如果您在解决 500 Internal Server 错误后遇到问题，您可以使用我的答案。 ;-)

【解决方案2】：

我不确定是否是这种情况，但请注意，IE 仅支持 .eot（嵌入式 OpenType）字体，您托管的字体在 Internet Explorer 中不起作用。不确定这是否是您的问题，但您的代码可能存在问题。

解决此问题的方法是使用字体转换器。我过去使用的一个是http://www.fontsquirrel.com/tools/webfont-generator。然后在你的 CSS 文件中调用 EOT 和 TTF 字体。我在下面提供了一个示例。

@font-face {
    font-family: Acme;
    src: url('fonts/eot/Acme-Regular.eot'),
         url('fonts/ttf/Acme-Regular.ttf');
}

如果这不是问题，我查看了您的代码，但在您的 CSS 中实际调用 @font-face 命令的实时站点上找不到，根据上面的 cmets，我也得到了 500尝试访问服务器上的字体时出错。

另一种选择是使用托管在 Google 服务器上的 Google Web Fonts Library，可以通过您的代码 http://www.google.com/webfonts 远程调用。

【讨论】：

【解决方案3】：

我认为，这与字体的版权有关。

我遇到了同样的问题，然后我在font squirrel 中找到了另一个类似的字体下载它们，并再次将它们转换为字体松鼠，然后使用他们的 css font-face 声明方式，现在它在 localhost 和我的实时网站中运行良好。

我什至用src: url('../fonts/

【讨论】：