字体在 Chrome 和 Firefox 中损坏，但在 Safari 中运行良好答案

【问题标题】：Fonts broken in Chrome and Firefox but works good in Safari字体在 Chrome 和 Firefox 中损坏，但在 Safari 中运行良好
【发布时间】：2016-10-03 11:09:27
【问题描述】：

我有一个网站，其中的字体在 safari 中看起来不错，但在 Chrome 和 Firefox 中却坏了。我找不到哪个规则覆盖了我的字体设置。请帮忙。

此页面位于http://alterknitnewyork.com/drop-off/

在 safari 中，它采用来自 uaf.css 的设置，但在 chrome 和 firefox 中，它们被计分了。我不知道它为什么坏了。即使我尝试将字体与!important 标记内联，但没有成功。

【问题讨论】：

您需要在此处发布显示问题的最少相关代码。指向您的网站，明天可能会改变或消失，对未来没有任何帮助。
这里的问题是@Rob，我找不到导致字体损坏的相关部分代码。
@Paran0a 在 chrome 上使用网络检查器，有人可以分析我的字体有什么问题吗？它适用于 safari，但不适用于 chrome。！！
@Paran0a 在截图中，p 的规则中有一个字体被划掉了。它不应该被计分，而应该被使用。

标签： css google-chrome firefox safari

【解决方案1】：

看起来您有两个“相同”字体的@font-face 声明。一个是在MyFontsWebfontsKit.css 中，它引用了一种字体为“Elizabeth-Italic”。 uaf.css 中的另一个声明将字体引用为“Elizabeth Italic”。这是两种截然不同的字体。

假设您想要斜体字体，只需将 font-family 设置为“Elizabeth-Italic”即可。

我建议删除您不需要的任何 CSS 文件（尤其是 @font-face 声明），这将减少 HTTP 请求的数量并使网站整体更快捷。

【讨论】：