Firefox 中的 CSS3 @font-face 根据 URL 前缀更改

Posted 2023-02-27

【中文标题】Firefox 中的 CSS3 @font-face 根据 URL 前缀更改

【英文标题】：CSS3 @font-face in Firefox changes according to URL prefix

【发布时间】：2012-10-30 03:59:01

【问题描述】：

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

前缀是指三个字母“www”。

这是一个例子：

http://www.purplemartinpress.com/

对比...

http://purplemartinpress.com/

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

【参考方案1】：

Firefox（实际上是大多数其他浏览器）将 www 子域视为任何其他子域 - 也就是说，带有 www 子域的 URL 与没有 www 子域的 URL 不同，即使它们的二级和***域是一样，所以不匹配。如果您有不匹配的域，那么您的 @font-face 字体将不会在 Firefox 中加载。详情请见this answer。

解决此问题的简单方法是在链接到同一域下的资源时使用域相对 URL（删除 URL 的 http://purplemartinpress.com 部分）或规范化 URL 以始终具有 www 或从不.