html - @Font-face 在某些浏览器中不显示大写字母 "A"

Question

奇怪的问题。我在网站上使用 @font-face 时遇到了一些问题。我最初并没有让大写的“A”出现在 Mac 上的 Chrome 中。显式设置字体粗细后，任何超过 300 的内容都可以。

但是，现在我看到它出现在 Firefox 和我的客户端计算机上的各种浏览器中。

这是我的代码:

@font-face {
    font-family: 'Avenir';
    src: url('../fonts/tricky.eot');
    src: url('../fonts/tricky.eot?#iefix') format('embedded-opentype'),
         url('../fonts/tricky.woff') format('woff'),
         url('../fonts/tricky.ttf') format('truetype'),
         url('../fonts/tricky.svg#ModernPictogramsNormal') format('svg');
    font-weight: 300;
    font-style: normal;
}

你可以在这里看到它:http://infirmaryhealth.mdidev.com/

感谢您的帮助-

Answer 1

解决了问题。

我使用的是 Zurb 的 Foundation 框架。他们将此应用于 h1 到 h6:

text-rendering: optimizeLegibility;

将其注释掉，瞧!