css - font-face 适用于桌面 Chrome 和桌面 Firefox，但不适用于桌面 Safari 或 iOS 浏览器

Question

我的字体在以下方面正常工作：

• 桌面铬
• 桌面火狐

相同的 font-face 调用不起作用：

• 桌面 Safari
• iOS 铬
• 火狐
• 苹果浏览器

您可以在此处查看带有网站/公司名称的 font-family 调用的登录页面：Derek Erb Solutions

字体系列声明：

@font-face {
font-family: 'Dce_handwriting';
src: url('/fonts/DceHandwritingRegular.woff') format('woff'),
url('/fonts/DceHandwritingRegular.ttf') format('truetype'),
url('/fonts/DceHandwritingRegular.otf') format('opentype'),
font-weight: normal;
font-style: normal;
font-display: fallback;

}

字体系列调用：

#sitename {
font-family: Dce_handwriting, sans-serif;
font-size: 6em;
margin: 0 auto;

}

在这里查看类似的问题，我确保从文件名中删除破折号和下划线，并在 font-family 声明中包含“src:”。

我可能一直在看我自己的代码太久才能看到问题......但这特别令人沮丧。

标签： cssfonts

Answer 1

与往常一样，问题的最大部分是一个愚蠢的分号！

最后一行应该是：

url('/fonts/DceHandwritingRegular.otf') format('opentype');

在行尾使用所有重要的分号而不是逗号。

这解决了几乎所有浏览器的问题......