@font-face 不能在 mac os 的 chrome 上工作答案

【问题标题】：@font-face can't work on chrome of mac os@font-face 不能在 mac os 的 chrome 上工作
【发布时间】：2017-05-08 09:45:35
【问题描述】：

@font-face {
  font-family: 'Noto Sans CJK SC Light';
  src: url('/src/assets/font/fonts/NotoSansCJKsc-Light-Alphabetic.eot');
  src: url('/src/assets/font/fonts/NotoSansCJKsc-Light-Alphabetic.eot?#iefix') format('embedded-opentype'),
  url('/src/assets/font/fonts/NotoSansCJKsc-Light-Alphabetic.woff2') format('woff2'),
  url('/src/assets/font/fonts/NotoSansCJKsc-Light-Alphabetic.woff') format('woff'),
  url('/src/assets/font/fonts/NotoSansCJKsc-Light-Alphabetic.ttf') format('truetype'),
  url('/src/assets/font/fonts/NotoSansCJKsc-Light.svg') format('svg');
  font-weight: normal;
  font-style: normal;
}
body {
  font-family: 'Noto Sans CJK SC Light', Roboto, -apple-system, ..., "Microsoft YaHei", SimSun, sans-serif;
}

在 ubuntu 的 chrome 上，我的网络应用程序的字体是“Noto Sans CJK SC Light”。但是在 macOS 上，在 safari 和 chrome 中，字体是“system-ui”。如何让@font-face 在 mac 的 chrome 上工作？

【问题讨论】：

从上面的代码中，我看到您缺少 woff、ttf 和 svg 的源代码。尝试将其添加到您的 CSS 中。您还尝试过字体的完整路径吗？您可以使用浏览器插件来测试渲染了哪些字体。
缺少 woff、ttf 和 svg 的来源？但我在 src 中指出了它们。有什么问题吗？
你不见了src:
不能使用','连接网址？

标签： fonts

【解决方案1】：

你试过吗？既然您知道 Mac 上的系统字体是什么，您应该可以将其放入您的字体系列中以使用它。

font-family: 'Noto Sans CJK SC Light', 'system-ui', [other fallback fonts];

让我知道这是否有效。

干杯

【讨论】：

font-family: 'Noto Sans CJK SC Light', Roboto, -apple-system,BlinkMacSystemFont; 不行..
您使用哪种编码语言？
打字稿。使用 angular2
那么请提出有意义的问题。我不是一个有棱角的人。请更新您的问题以包括所有内容，包括显示字体的代码。如果您遇到问题，请查看告诉您如何提出“正确”问题的页面！