在 MacOS 上，Safari 和 Chrome 之间的 Lato 字体粗细似乎有所不同

Question

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

Answer 1

正如您在这个答案中看到的那样：Font weight turns lighter on Mac/Safari

…使用

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

…或

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

Answer 2

在 MacOS 上跨 Safari、Chrome 和 Firefox 规范字体的最佳方法实际上不是让它们在 Safari 中变粗，而是在 Chrome 和火狐：

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

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

之间的字体

Lato Font weight appears different between Safari and Chrome on MacOS