0

我正在开发一个网站，但我刚刚意识到我的字体仅在 Safari 上呈现存在问题，我没有找到解决方案。

基本上我在我的网站上使用了两种自定义字体。一个字母间距为 0.05em 以尊重我的 psd 文件。

我的字体在 Chrome、Firefox、Internet Explorer 上呈现良好。但对于 Safari，奇怪的是，它不起作用，字母间距不呈现。我在某处读到它可能是 webkit 的问题，但如果是这种情况，为什么它会在 chrome 上工作？这真的让网站在 safari 上变得很糟糕，我需要找到一个修复程序。

我无法相信没有可能的解决方法。

如果您有任何想法，那将很高兴。

下面是我的代码。

Css 声明字体：

@font-face {
    font-family: 'univers_lt_std_59_ultracnRg';
    src: url('fonts/univers-lt-std-59-ultra-condensed-webfont.eot');
    src: url('fonts/univers-lt-std-59-ultra-condensed-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/univers-lt-std-59-ultra-condensed-webfont.woff') format('woff'),
         url('fonts/univers-lt-std-59-ultra-condensed-webfont.ttf') format('truetype'),
         url('fonts/univers-lt-std-59-ultra-condensed-webfont.svg#univers_lt_std_59_ultracnRg') format('svg');
}

我的段落的CSS：

color: #57585a;
font-family: 'univers_lt_std_59_ultracnRg';
letter-spacing: 0.05em;
font-size: 19.58px;
text-transform: uppercase;
-webkit-font-kerning: initial;
line-height: 26.47px;

在 Chrome Firefox 和 Internet Explorer 上呈现

在此处输入图像描述

在 Safari 上渲染

在此处输入图像描述

显然字母间距不起作用..

如果您有任何想法，再次感谢。

4

1 回答 1

1

尝试使用像素而不是字母间距的相对值。此外，对字体大小和行高使用整数。众所周知，Safari 以不同的方式舍入。

于 2013-11-19T23:05:11.660 回答