css - Windows 上参差不齐的网站字体

Question

我建立这个网站已经有一段时间了，但是我用于标题的字体在使用 Chrome 的 Windows 上看起来参差不齐，尽管它在 Mac 或使用 Edge 上看起来很完美:Link
我确实尝试了各种字体平滑属性无济于事，使用文本阴影使它看起来很奇怪。还有什么我可以尝试的吗？

Answer 1

The font I use for headers looks ragged on Windows using Chrome

1. 您的 webkit-font-smoothing 规则缺少一个 - 前缀，它应该是 -webkit-font-smoothing

2. 解决Chrome字体渲染问题，添加-webkit-text-stroke: 0.3px;

区别:

最终代码:

h1, h2 {
    -webkit-font-smoothing: subpixel-antialiased;
    -webkit-text-stroke: 0.3px;
}

* 您可能需要将上述 CSS 应用于所有使用自定义字体的选择器。

---

预览

原始答案:https://stackoverflow.com/a/11493510/877671投票关闭重复。