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

Question

我的字体可以正常工作:

• 桌面版 Chrome
• 桌面火狐

相同的字体调用不工作:

• 桌面浏览器
• iOS 浏览器
• iOS 版火狐
• iOS 浏览器

您可以在此处看到带有网站/公司名称字体系列调用的着陆页: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;

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

我可能已经查看自己的代码太久了，以至于再也看不到问题了……但它特别令人沮丧。

Answer 1

一如既往，问题的最大部分是一个愚蠢的分号!

最后一行应该是:

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

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

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