@font-face - CSS 字体的奇怪请求 URL答案

【问题标题】：@font-face - strange request URL for CSS fonts@font-face - CSS 字体的奇怪请求 URL
【发布时间】：2013-12-13 21:57:34
【问题描述】：

这是一个愚蠢的问题，我假设有一个简单的解决方法。我在 Wordpress 主题中使用网络字体 - 我正在处理的网站有两个可用于访问同一网站的域。

在我的 CSS 中，我使用了 font-squirrel 格式来声明字体：

@字体脸{ 字体系列：“奥斯瓦尔德”； src: url('oswald-regular-webfont.eot'); src: url('oswald-regular-webfont.eot?#iefix') 格式('embedded-opentype'), url('oswald-regular-webfont.woff') 格式('woff'), url('oswald-regular-webfont.ttf') 格式('truetype'), url('oswald-regular-webfont.svg#Oswald') 格式('svg'); 字体粗细：正常；字体样式：正常； }

当我转到其中一个域时，这可以正常工作，但是当我通过另一个域访问该站点时，字体无法加载，因为它被认为是“跨站点”请求。基本上，当我访问 domain1.com 时，请求如下所示： http://www.domain1.com/fonts/oswald-regular-webfont.ttf

但是当我访问 domain2.com 时，请求仍然是这样的。为什么？由于我使用的是相对路径，因此 domain2.com 不应该请求： http://www.domain2.com/fonts/oswald-regular-webfont.ttf

有人知道我在这里搞砸了什么吗？ Wordpress 是否以某种方式将完整路径注入 CSS？

注意：它适用于 Chrome，但不适用于 Firefox 或 IE10。 Chrome 也有同样奇怪的 URL 行为，区别只是 Chrome 允许跨站请求。

【问题讨论】：

对于 Firefox，这个博客 post 似乎值得
这是一个非常有趣的准备工作，而且很有帮助 - 谢谢伙计，我将能够使用这些信息。

标签： html css wordpress fonts font-face

【解决方案1】：

这很可能是因为您使用get_stylesheet_directory_uri() 或类似方法来获取CSS 文件的路径，然后在wp_enqueue_style() 调用中使用它。

当它呈现给浏览器时，页面将具有文件的完整路径，而不是相对路径，这意味着字体文件是相对于另一个站点的，因此它是跨站点的。

【讨论】：