css - @fontface chrome 渲染到高

Question

我在谷歌浏览器中使用@fontface 时遇到一些问题。字体渲染得太高。

当我将字体更改为 Arial 时，该按钮在所有浏览器中都正常。当我将它更改为 @fontface 字体时，文本会跳起来。

下面是 2 张图片，显示了 Firefox 和 Chrome 之间的区别。

我能做什么？

我试过: -webkit-font-smoothing:抗锯齿；

我还在字体声明之后为所有字体添加了以下内容:

@media screen and (-webkit-min-device-pixel-ratio:0) {
    @font-face {
        font-family: 'Museo-Sans-Rounded-100-Regular';
        src: url('../fonts/Museo-Sans-Rounded-100-Regular.svg') format('svg');
    }
} 

两者都没有帮助。

我能做什么？非常欢迎所有帮助!

Answer 1

感谢 Vira 指出正确的帖子。可以在这里找到解决方案:

@font-face svg not working properly in Chrome?