Firefox 中的 CSS3 @font-face 根据 URL 前缀变化

Question

在使用 Firefox (v16) 时，我注意到根据 URL 前缀，CSS 字体会或不会加载...

我所说的前缀是指三个字母“www.”

这是一个例子:

http://www.purplemartinpress.com/

比...

http://purplemartinpress.com/

在 Firefox 中使用“www”前缀时，字体不会加载。这是为什么？

Answer 1

Firefox(实际上大多数其他浏览器)像对待任何其他子域一样对待 www 子域——也就是说，带有 www 子域的 URL 与没有 www 子域的 URL 是不同的，即使它们的二级域和顶级域是相同，所以不匹配。如果您有不匹配的域，那么您的 @font-face 字体将不会在 Firefox 中加载。参见 this answer了解详情。

解决此问题的简单方法是在链接到同一域下的资源时使用域相对 URL(删除 URL 的 http://purplemartinpress.com 部分)或规范化您的 URL 要么始终包含 www，要么从不包含。