0

我正在使用来自 MyFonts.com 的字体系列，并像他们在示例 css 中一样包含它：

@import url("//hello.myfonts.net/count/xxxxxx");
@font-face {
    font-family: 'URWGroteskNarrow';
    src: url('fonts/XXXXXX_1_0.eot');
    src: url('fonts/XXXXXX_1_0.eot?#iefix') format('embedded-opentype'),
         url('fonts/XXXXXX_1_0.woff') format('woff'),
         url('fonts/XXXXXX_1_0.ttf') format('truetype');
    font-style: normal;
    font-weight: normal;
}

该字体在所有浏览器中都可以正常显示，但 Chrome 中的基线存在问题。字体显示比其他浏览器高一点：（左：Firefox，右：Chrome）

左：Firefox，右：Chrome

似乎 Chrome 使用了不同的基线，这不仅导致当 line-height 和 height 相同时字体不垂直居中（参见深色导航栏），甚至在顶部被截断。

任何想法为什么会发生这种情况？

4

0 回答 0