html - CSS Glyphs 不适用于 MaxCDN 或缓存服务

Question

我使用的是菜单项旁边的模板中包含的 CSS 字形。使用这些，名称旁边会出现一个小图标，如果它包含多个元素，旁边会出现一个箭头。

但是，每当我安装缓存插件或 MaxCDN(我只是通过打开 MaxCDN 对其进行测试)时，它们就会在 Firefox 和 IE 9-11 中停止工作(我认为在非基于 webkit 的浏览器中)。奇怪的是，他们使用这些未激活的插件。

火狐之前:

.icon-envelope:before {
content: "";
}

之后:

.icon-envelope:before {
content: "";
}

Chrome 之前:

.icon-envelope:before {
content: "\f0e0";
}

之后:

.icon-envelope:before {
content: "\f003";
}

这些比较了应用MaxCDN前后浏览器在开发人员检查工具中显示的内容。这些字形是通过 Font-Awesome 获得的，但 joomla 模板不直接使用 bootstrap.css(所以我认为使用 bootstrapCDN 不会有帮助)。

Answer 1

这很可能是由于 CORS。 MaxCDN 有一篇关于如何向 HTTPD、Nginx 和 IIS 添加 Access-Control-Allow-Origin header 的文章:http://support.maxcdn.com/howto/use-cdn-with-webfonts/

如果缺少以下 http header ，Firefox 会阻止 webfonts 呈现:

Access-Control-Allow-Origin "*"

希望对您有所帮助。