缺少跨域资源共享 (CORS) 响应标头
浏览器:
- Firefox(3.5 及更高版本)
- Internet Explorer (9+)
- Chrome(37 及更高版本)
概览
Chrome、Firefox 和更新版本的 Internet Explorer 都会强制执行跨域资源共享标准,因此只会呈现带有相应“Access-Control-Allow-Origin”响应标头提供的网络字体。由于 Google Fonts 可在任何网域上查看,因此系统将使用以下响应标头提供字体:
Access-Control-Allow-Origin:*
潜在原因
某些代理可能会从响应中去除标头,之后浏览器不会呈现字体。
正在诊断
使用 Chrome 时,请查看 DevTools 控制台中的相关警告消息。
使用 Firefox 时,用户可以使用 Firebug 或 Live HTTP Headers 扩展程序查看响应标头,以确认存在 CORS 响应标头。
链接
安装 NoScript 插件后,Firefox 中不会显示网页字体
浏览器: * Firefox(3.5 及更高版本)
概览
安装 NoScript 插件后,Firefox 不会显示网页字体。
潜在原因
默认情况下,NoScript 插件会停用 @font-face 规则。
解决方案
打开 NoScript 选项,转到“嵌入”标签页,然后取消选中:Forbid @font-face
网页字体未显示
浏览器: * 全部
概览
使用的网络字体未显示。
潜在原因
API 网址有误,或已请求字体不支持的样式。
解决方案
请确保网址格式正确,大小写遵守字体名称(例如,Droid Serif 不是 droid Serif),遵循权重和样式的语法以及加载多个系列的语法(请参阅文档:使用入门 - 语法)。 当字体未显示时,查看样式表的内容可提供有关错误情况的更多信息。将该网址复制并粘贴到浏览器中,并确保您不会看到任何错误消息。例如,请求 Droid Serif 不支持的权重将显示以下错误消息:
/* Droid Serif (style: normal, weight: 300) is not available */ /* However, style: normal, weight: normal is available */ /* However, style: italic, weight: normal is available */ /* However, style: normal, weight: bold is available */ /* However, style: italic, weight: bold is available */ /* Not supported. */
网页标题中的字体较粗
浏览器: * 全部
概览
在标题 (h1、h2 等) 中使用时,字体很粗,但字体为正常 (400) 粗细。
潜在原因
浏览器会自动加粗文本。
解决方案
确保在标头中应用字体时,在 CSS 规则中指定正确的字体粗细:
h1 { font-family: Lobster, cursive; font-weight: 400; }