font-family Work Sans 在 Google Chrome 中不起作用答案

【问题标题】：font-family Work Sans not working in Google Chromefont-family Work Sans 在 Google Chrome 中不起作用
【发布时间】：2021-01-11 18:02:38
【问题描述】：

刚刚访问了一个我大约一个月没有使用的应用，发现“Work Sans”字体在 Google Chrome 中无法正常工作。

Chrome 开发者工具控制台中没有错误消息 - 字体似乎没有被应用。

jsFiddle demonstration link

在 Google Chrome 版本 77.0.3865.90（官方构建）（64 位）中查看：

更新 - 在 Chrome 78.0.3904.70 中仍然无法正常工作

在 Firefox Quantum 69.0.1（64 位）中查看：

HTML

<head>
  <link href="https://fonts.googleapis.com/css?family=Noto+Sans|Roboto+Mono|Work+Sans:400,700&display=swap" rel="stylesheet">
</head>

<p class="testing1">
  Chrome Version 77.0.3865.90 (Official Build) (64-bit)
</p>


<p class="testing2">
  Chrome Version 77.0.3865.90 (Official Build) (64-bit)
</p>

<p class="testing3">
  Chrome Version 77.0.3865.90 (Official Build) (64-bit)
</p>

CSS

.testing1 {
  font-family: 'Work Sans', sans-serif;
}

.testing2 {
  font-family: 'Roboto Mono', monospace;
}

.testing3 {
  font-family: 'Noto Sans', sans-serif;
}

编辑：

如果有人想知道，@import 方法会导致相同的不良行为，即：

@import url('https://fonts.googleapis.com/css?family=Noto+Sans|Roboto+Mono|Work+Sans:400,700&display=swap');

【问题讨论】：

标签： google-fonts

【解决方案1】：

我试过这个方法，它对我有用

如果您需要在 chrome 浏览器中显示特定类型的字体（通常不常见），您需要在系统中找到 install ，大多数情况下可以在线免费找到。

安装 .ttf 字体类型（在 windows 中）并更改将 chrome 中的字体设置为您想要的任何字体，它应该可以正常工作。

【讨论】：

【解决方案2】：

我刚刚使用与您相同的 Google Chrome 版本进入，并且可以正常工作并且链接是正确的

<link href="https://fonts.googleapis.com/css?family=Noto+Sans|Roboto+Mono|Work+Sans:400,700&display=swap" rel="stylesheet">

您的应用也没有什么。也许是谷歌字体临时问题。如果在使用 sans-serif 之前再次中断，也许你也可以使用 Roboto Mono 作为后备

.testing1 { font-family: 'Work Sans', 'Roboto Mono', sans-serif; }

【讨论】：

我刚刚在最近的chrome浏览器更新（版本77.0.3865.120和78.0.3904.70）中测试了jsFiddle链接，重启并清除了浏览器缓存，问题依旧。