Question

我在网站上遇到一个非常奇怪的问题。

我们最近推出了website，它在PC上运行良好。但是当谈到Mac时，浏览器根本不会显示任何字体。

我使用font-face包含特定字体，根据屏幕宽度，有2种不同的样式表。我在这里尝试了几个选项，但似乎都没有。我在css中使用的最后一种语法就像这样

@font-face {
    font-family:'ChollaSansGr';
    src: url('http://:/')format('IE-No-404'),url('./fonts/ChSaGrRg.ttf') format('truetype');
    font-style: normal;
    font-weight: 700;
}

所以我的问题是，是否有人可以帮助我解决问题或提出可能是问题根源的建议。

Answer 1

如果你正在使用Safari，我在网上找到了这个解决方案：

事实证明我已经解决了这个问题，至少到目前为止在Mac上已经解决了。这是：

创建webkits的font-squirrel和字体注册表生成CSS   在URL周围使用“和”。这似乎可以解决问题。他们也是   将所有的重量和样式设置为正常，这似乎也很糟糕   破坏。

这是由字体squirrel为2个面部生成的代码   拉托：

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

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

以下是我将其更改为实际适用于Safari和Chrome的内容和Firefox：

@font-face {
   font-family: Lato;
    src: url(../../fonts/Lato-BlackItalic-webfont.eot);
    src: url(../../fonts/Lato-BlackItalic-webfont.eot?#iefix) format(embedded-opentype),
         url(../../fonts/Lato-BlackItalic-webfont.woff) format(woff),
         url(../../fonts/Lato-BlackItalic-webfont.ttf) format(truetype),
         url(../../fonts/Lato-BlackItalic-webfont.svg#LatoBlackItalic) format(svg);
    font-weight: 900;
    font-style: italic;
}


@font-face {
    font-family: Lato;
    src: url(../../fonts/Lato-Black-webfont.eot);
    src: url(../../fonts/Lato-Black-webfont.eot?#iefix) format(embedded-opentype),
         url(../../fonts/Lato-Black-webfont.woff) format(woff),
         url(../../fonts/Lato-Black-webfont.ttf) format(truetype),
         url(../../fonts/Lato-Black-webfont.svg#LatoBlack) format(svg);
    font-weight: 900;
    font-style: normal;
}

链接在这里： ~~http://css-tricks.com/forums/discussion/10797/font-face-not-working-in-only-safari-/p1~~

希望这有帮助。

font-face不在Mac上显示

1 个答案: