3

我想知道是否可以在另一个域上托管 webfonts，我的 CSS 托管在 Amazon CloudFront 和我的 webfonts 上，但它们没有显示，当我的 css 在本地时很好。

这是我在 CloudFront 上的 style.css：

@font-face {
    font-family: 'Aller';
    src: url('/app/files/fonts/allerdisplay-webfont.eot');
    src: local('☺'), url('/app/files/fonts/allerdisplay-webfont.woff') format('woff'), url('/app/files/fonts/allerdisplay-webfont.ttf') format('truetype'), url('/app/files/fonts/allerdisplay-webfont.svg#webfontLZ8nc4vC') format('svg');
    font-weight: 900;
    font-style: normal;
}

样式表使用子域托管在 CloudFront 上：static.mydomain.com/style.css 可以从以下位置下载 Webfont：static.mydomain.com/app/files/fonts/allerdisplay-webfont.ttf

不幸的是，当从 mydomain.com 调用样式表时，它不会加载它。我想知道这是否是一个限制或类似的东西。

谢谢

4

1 回答 1

3

样式声明中 URL 的绝对路径应该没有问题。

在上面的代码中，您有相对路径 URL。
您需要一个绝对路径 URL，例如：

“http://static.mydomain.com/app/files/fonts/allerdisplay-webfont.ttf”（绝对）

- 不是 -

“/app/files/fonts/allerdisplay-webfont.ttf”（相对）

从理论上讲，根据您的子域的体系结构，您可能能够设计一种方法来维护相对 URL，但这不值得麻烦。只需使用绝对的并完成它。

[之前的建议是在相关代码发布之前发布的] 但是Google Web Fonts通过将整个样式表移动到云端来实现这一切。如果你不能让它在样式表中运行，你可以尝试创建一个单独的样式表来代替。

但是请注意，要获得真正的跨浏览器兼容性，您需要一堆不同的字体文件格式……这可能是问题所在。 FontSquirrel有一个字体工具包生成器，您可能想查看它。

于 2011-02-18T12:37:12.833 回答