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

Question

我的字体在以下设备上正常工作：

桌面Chrome
桌面火狐

相同的字体调用不工作：

桌面版 Safari
iOS Chrome
iOS 火狐
iOS 野生动物园

您可以在此处看到带有 site/company 名称的字体系列调用的着陆页：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');

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

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

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

font-face works in desktop Chrome & desktop Firefox but not in desktop Safari nor iOS browsers

css

fonts