html - 字体 (Roboto) 在 Chrome 上看起来比 Firefox (Windows) 更粗

Question

我在我的网络应用程序中广泛使用 Roboto 字体。我在 Linux 上开发，一切都很好，但后来我检查它在 Windows 上看起来是否一样，但事实并非如此。在 Windows-Chrome 中，字体更加大胆和丑陋，在 Opera 中也是如此。只有在 Firefox 中它看起来很正常(就像在 Linux 中的每个浏览器上一样)。我什至制作了一个 fiddle 并在 2 个浏览器上进行了比较:

http://jsfiddle.net/mhk2c4by

enter code here

在 Linux 上的 Chrome 中，它看起来像在 Windows 上的 Firefox 中，这是应该的。

我能做些什么来解决这个问题吗？大多数人会在 Windows-Chrome 上使用我的应用程序，我有点不喜欢这种字体。从图片上看它并没有那么糟糕，但在实时应用程序中它有很大的不同。

Answer 1

在您的 chrome 中键入此内容以启用 2G 网络字体加载。

 chrome://flags/#enable-webfonts-intervention-v2

在你的代码中使用 css reset: 2017’s most popular CSS Reset scripts

或者您可以创建 jquery 函数来检测使用的是哪个浏览器，并将类 .chrome 应用于 body，这会将字体更改为更粗的字体。

function setBrowserClasses() {
    $.browser.chrome = /chrom(e|ium)/.test(navigator.userAgent.toLowerCase());
    if (true === $.browser.chrome) {
        $('body').addClass('chrome');
    }
}