未使用字体系列 Open Sans答案

【问题标题】：Font Family Open Sans not being used未使用字体系列 Open Sans
【发布时间】：2014-05-19 10:30:12
【问题描述】：

我在我的应用程序中使用Google's Open Sans Font。

我已经按照说明定义了样式表：

<link href='http://fonts.googleapis.com/css?family=Open+Sans:400,300,700'
 rel='stylesheet' type='text/css'>

然后我在 body 选择器上使用它：

body {
    font-family: 'Open Sans', sans-serif;
}

我没有在其他任何地方定义字体系列。我假设既然我在父元素上定义了它，子元素会自动继承它。

但是，如果我在我的应用程序中打开检查器以查看锚标记并查看该标记的计算样式，我发现（Chrome 最新）“渲染字体”显示“Times New Roman 18 字形” - 是这对吗？我原以为它会说“Open Sans”——Open Sans 字体没有被应用吗？

【问题讨论】：

你有 JSFiddle 吗？
无法复制。文本 look 是否像 Open Sans？它应该与 Times New Roman 有明显的区别。 Chrome 中的“渲染字体”信息可能是网络字体的虚假信息。
@JukkaK.Korpela 请看答案 - 显然它是 chrome 的某种错误（因为我没有 Firefox 的问题）

标签： css fonts font-family

【解决方案1】：

查看codepen link。它对我来说很好用！

.open-sans-font{
  font-family: 'Open Sans', sans-serif;
}

<link href="https://fonts.googleapis.com/css?family=Open+Sans:300,400,700" rel="stylesheet">

<div class="open-sans-font">
   Stackoverflow rocks !!!
</div>

【讨论】：