不同浏览器中的字体重量问题，相同字体在不同浏览器中看起来不同

Question

我正在开发Asp.net MVC应用程序。

在我的应用程序中，显示的文本看起来不像Firefox那样粗体。

铬：

的FireFox：

这是我的css：

body {
    font-size: 13px;
    color: #333;
    background: #f2f6f7;
    font-family: 'Roboto', sans-serif;
    -webkit-font-smoothing: antialiased;
}

我可以在代码中更改任何内容以在所有浏览器中获得相同的感觉吗？

Answer 1

您可以尝试设置text-rendering: optimizeLegibility;值得注意的是，所有浏览器都有自己的渲染引擎，因此可能无法完美呈现。

Answer 2

你可以在Firefox中试试这个：

-moz-osx-font-smoothing: grayscale;

或者，如果您不想使用更薄的字体，则可以在Chrome中禁用字体平滑：

-webkit-font-smoothing: unset;