css - 字体在 Safari 上无法正确显示

Question

我在 Safari 上的字体显示有问题。字体在某些页面上看起来比其他页面粗一些。我使用 @font-face 在整个网站(无粗体)中仅加载正常的 font-weight。

Firefox 和 Chrome 似乎在每个页面上都显示相同粗细的字体。

这是我的代码:

@font-face {
  font-family: 'Stanley';
  src: url('Stanley-RegularItalic.eot');
  src: url('Stanley-RegularItalic.eot?#iefix') format('embedded-opentype'),
    url('Stanley-RegularItalic.woff2') format('woff2'),
    url('Stanley-RegularItalic.woff') format('woff'),
    url('Stanley-RegularItalic.ttf') format('truetype'),
    url('Stanley-RegularItalic.svg#Stanley-RegularItalic') format('svg');
  font-weight: normal;
  font-style: italic;
}

@font-face {
  font-family: 'Stanley';
  src: url('Stanley-Regular.eot');
  src: url('Stanley-Regular.eot?#iefix') format('embedded-opentype'),
    url('Stanley-Regular.woff2') format('woff2'),
    url('Stanley-Regular.woff') format('woff'),
    url('Stanley-Regular.ttf') format('truetype'),
    url('Stanley-Regular.svg#Stanley-Regular') format('svg');
  font-weight: normal;
  font-style: normal;
}

查看两个不同页面的截图:

Answer 1

试一试，将其添加到您的font-face

speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
-webkit-font-smoothing: antialiased;