字体系列 Open Sans 不起作用
Posted
技术标签:
【中文标题】字体系列 Open Sans 不起作用【英文标题】：Font family Open Sans not working 【发布时间】：2015-12-07 03:17:38 【问题描述】：我在我的网站上使用Open Sans font，但它不能在所有计算机上运行，我不知道为什么。
我在我的<head> 标记中调用它。我试过https或http或//，结果是一样的。
<link href='//fonts.googleapis.com/css?family=Open+Sans:400italic,600italic,700italic,400,600,700' rel='stylesheet' type='text/css'>
从浏览器加载良好（状态 200）。
我的 CSS 如下所示：
body
font-family: OpenSans;
但我的文本是用一些无衬线字体呈现的，除了它在 CSS 检查器中提到 Open Sans 之外。即使我从 Chrome 浏览器的 CSS 检查器中删除了所有字体系列，字体也不会改变。另外，如果我添加 !important，没有任何变化。
这个问题的根源是什么？
我已经尝试过this solution，但没有成功。
我认为这不是冲突，因为它在某些计算机上运行。
【问题讨论】：
您还必须向我们展示您的 CSS 您的风格可能有冲突，但具有更高的特异性。有关如何计算选择器特异性的更多信息，请参阅this calculator。将body font-family: 'Open Sans', sans-serif !important; 添加到您的样式表中。如果添加到末尾的!important; 有效，则它支持这样的理论，即样式覆盖了您原来的Open Sans font-family 声明。查看您的浏览器开发工具，找到样式并将其删除。确保同时删除!important;。这将有助于调试，但不应继续使用..
另外，请检查您的网址是否有效。我忘记了，但在某些情况下// 不起作用（可能是某些浏览器）
仅注入<link href="..." type='text/css' /> 不足以在现场使用字体。正如@War10ck 建议的那样，您还应该在链接标签之后添加<style>body font-family: 'Open Sans', sans-serif !important; </style>。
【参考方案1】：
好的，我的主要错误是使用font-family: OpenSans; 而不是font-family: 'Open Sans';
【讨论】：
【参考方案2】：您是否尝试使用 https 来引用您的 CSS？
<link href="https://fonts.googleapis.com/css?family=Open+Sans:400italic,600italic,700italic,400,600,700" rel="stylesheet" type="text/css">
我用 JSFiddle 试过这个，它在我的 Chrome 中工作。 https://jsfiddle.net/doqvqfhe/1/
你能提供更多代码吗？
【讨论】：
【参考方案3】：我使用字体系列“Open Sans”，它可以代替“OpenSans”。
【讨论】：
以上是关于字体系列 Open Sans 不起作用的主要内容，如果未能解决你的问题，请参考以下文章
打开 Sans Condensed Light 在 Firefox 中不起作用