MacOS 上 Safari 和 Chrome 的 Lato 字体粗细不同答案

【问题标题】：Lato Font weight appears different between Safari and Chrome on MacOSMacOS 上 Safari 和 Chrome 的 Lato 字体粗细不同
【发布时间】：2017-09-27 19:12:08
【问题描述】：

为什么即使我的网站 CSS 相同，但 Lato 字体在 Chrome (MacOSX) 上呈现的重量比在同一台机器上的 Safari 上略重？

【问题讨论】：

标签： css macos google-chrome fonts webfonts

【解决方案1】：

在 MacOS 上标准化 Safari、Chrome 和 Firefox 字体的最佳方法实际上不是在 Safari 中使它们变粗，而是在 Chrome 和 Firefox 中使它们变细：

body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

这将使所有字体更像 Safari 的呈现方式，但更清晰。 Windows 倾向于使字体比 Mac 更轻，因此这也应该规范 Windows 和 Mac 的字体。

【讨论】：

【解决方案2】：

正如您在此答案中看到的：Font weight turns lighter on Mac/Safari

…使用

-webkit-font-smoothing: subpixel-antialiased;
使字体在 Safari 中的显示与在 Chrome 中的显示相同（加粗）。

…或

-webkit-font-smoothing: antialiased;
使字体在 Chrome 中的显示与在 Safari 中的显示相同（更细）。

【讨论】：

谢谢。这会影响 Windows 和 Mac 吗？哪个被认为更“优越”，哪个最兼容或最广泛？
@Sammy 我没有 Windows，所以我无法测试它。但我认为它更像是 Mac 的东西，因为通常字体渲染在 macOS 上是不同的。也许你可以测试一下哪个选项更适合 Windows？
会的。谢谢！