如何使跨浏览器的css字体粗细一致

Question

我正在使用我使用@font-face css 选择器在我的网站中实现的自定义字体，并为不同的浏览器提供了不同的字体格式，到目前为止，firefox、chrome IE11 和 opera 大致呈现字体一样的。

但是当谈到给font-weight: 900;只有 Chrome 成功渲染了足够粗的字体， firefox 和 IE 的渲染接近于 chrome 在 500 或 600 时的渲染

是否有一种解决方法可以在其他浏览器中实现相同的结果，而不必以所有不同格式实现字体的粗体版本???

firefox rendering

chrome rendering

Answer 1

保持字体粗细一致的最佳方法是确保字体带有粗体粗细字体文件。如果您的字体文件没有达到您想要的重量，那么浏览器和操作系统将尝试手动设置字体样式，如您所见，这会导致不同的渲染。