没有出现在 iphone 和 firefox 上的 webfont答案

【问题标题】：webfont that does not appear on iphone and firefox没有出现在 iphone 和 firefox 上的 webfont
【发布时间】：2020-08-26 10:29:52
【问题描述】：

你好（对不起英语我是法国人），

问题是使用的字体在firefox和iOS中都没有显示。

代码如下：

@font-face {
    font-family: 'ProximaNova-Regular';
    src: url('webfonts/2ACFD6_0_0.eot');
    src: url('webfonts/2ACFD6_0_0.eot?#iefix') format('embedded-opentype'),
    url('webfonts/2ACFD6_0_0.woff') format('woff'),
    url('webfonts/2ACFD6_0_0.ttf') format('truetype'),
    url('webfonts/2ACFD6_0_0.svg#wf') format('svg');
}

对于正文元素：

font: normal 1.25em/1.2 ProximaNova-Regular;

我为 iOS 尝试了几件事：

AddType image/svg-xml svg
AddType image/svg-xml svgz

对于火狐：

<FilesMatch "\.(ttf|otf|eot|woff)$">
  <IfModule mod_headers.c>
    Header set Access-Control-Allow-Origin "*"
  </IfModule>
</FilesMatch>

我还检查了文件 .svg，字体标签上有 id wf。

谢谢

【问题讨论】：

在 Firefox 中尝试 Ctrl+Shift+K 并告诉它显示了什么？
如果它显示下载失败或尝试刷新（Ctrl + F5）您的浏览器，如果问题仍然存在，那么我们可能需要解决。
当我尝试 CTRL+F5 时出现同样的错误
okies.. 我们现在不需要检查.. 给我一些时间..:)

标签： ios css firefox svg webfonts

【解决方案1】：

网页字体也不会出现在 Chrome 或 IE 上。原因很简单，引用的字体资源不存在，即http://www.anthonyblochet.fr/css/webfonts/2ACFD6_0_0.woff 之类的 URL 会导致 404 Not Found 响应。

【讨论】：

我忘记在我的 css 中输入 ../ 以返回文件

【解决方案2】：

代替

<FilesMatch "\.(ttf|otf|eot|woff)$">
  <IfModule mod_headers.c>
    Header set Access-Control-Allow-Origin "*"
  </IfModule>
</FilesMatch>

试试

<FilesMatch "\.(eot|otf|woff|ttf)$">
  SetEnvIf Origin »
    "^http(s)?://(.+\.)?(domain1\.org|domain\.com)$" origin_is=$0
  Header set Access-Control-Allow-Origin %{origin_is}e env=origin_is
</FilesMatch>

【讨论】：

同样的问题，我已将您的代码放在我的 webfonts 文件夹中的 .htaccess 文件中，可以吗？我输入了 CTRL+F5 ：同样的错误。