未使用字体系列 Open Sans

Posted

技术标签:

【中文标题】未使用字体系列 Open Sans【英文标题】:Font Family Open Sans not being used 【发布时间】: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 的问题) 【参考方案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">
   *** rocks !!!
</div>

【讨论】:

以上是关于未使用字体系列 Open Sans的主要内容,如果未能解决你的问题,请参考以下文章

如何指定系统的默认serif和sans-serif字体系列?

CSS 字体系列:Lucida Sans Unicode

我现在如何在网页上使用哪个字体系列文本[关闭]

CSS丨如何使用 CSS Font 属性

如何在 Outlook 中实现 Open Sans Web 字体?

字体系列中的字体显示大小不同