Html 为什么这个网站上的Chrome没有正确使用粗体字体

我的问题是没有正确应用字体样式。看起来，浏览器只是自己将字体加粗，这导致了一个丑陋的人造加粗

在Firefox中，一切正常。问题只存在于谷歌浏览器中

以下是演示的链接：

字体都已加载，但无法使用。我错过了什么

[Windows上Chrome屏幕截图][2]

---

链接2作为注释…

我可能已经找到了解决方案：

---

Chrome的@font-face似乎有一个bug。

正如我最近注意到的，你2016年的问题在2020年仍然存在。所以我认为回答这个老问题还是可以的

解决方案是为MacOS上基于webkit的浏览器定义一个特殊的css属性。请在身体标签中插入以下css：

-webkit-font-smoothing: antialiased;

这改变了Safari和Chrome中MacOS上的字体外观，就像MacOS上的Firefox和Windows上的Chrome一样。作为一个副作用，普通字体将显示得稍微薄一点

顺便说一句，apple.com的网站也使用这种css设置

这里详细描述了背景：

解决方案的简短摘要：

---

“Mac使用亚像素渲染来提高显示的明显分辨率，这有助于渲染更清晰、更清晰的文本。这就是为什么文本看起来更粗体，即使没有设置。因此，在Safari和Chrome浏览器上，您可以关闭亚像素渲染，而是使用标准抗锯齿技术使字体看起来更平滑。”

[2]：在我的Chrome浏览器中显示良好-版本51.0.2704.84（64位），也在Mac OS上。感谢测试。我也有51.0.2704.84版（64位），它在屏幕截图上看起来像。我也在另一台mac上测试了它。如果字体是本地安装的，是否会出现问题？我认为两款mac电脑的屏幕设计也都有这种精确的字体。