ios - 手机上的@Fontface 不显示在手机上

Question

我对此感到非常困惑，并且我已经通过之前的线程检查了所有合规性，但字体仍然无法在移动设备上正确显示。

它在桌面上完美运行。

h1 {
  font-family: futura;
  color: #ffffff;
  font-size: 6vw;
 }
@font-face {
     font-family: 'Futura'; /*a name to be used later*/
     src: url('https://cdn.glitch.com/3484f4c3-fd8c-4f1e-8369-372660a87d9f%2FFutura-Display-BQ-Regular.ttf?1550870232783') format('truetype'),
         url('https://cdn.glitch.com/3484f4c3-fd8c-4f1e-8369-372660a87d9f%2FFutura-Display-BQ-Regular.woff?1550870502016') format('woff');/*URL to font*/

}

感谢收到的任何帮助

Answer 1

在 @font-face 声明和样式定义中为 font-family 使用不同的名称(使用普通的“Futura”以外的其他名称；参见https://jsfiddle.net/a8vy7s0c/)。在 iOS 上本地有一个名为 Futura 的系列，因此当该代码在那里运行时，它使用本地系列而不是 @font-face 声明中指定的系列。

附言这最初让我失望，因为我测试了代码并看到它“工作”，即它正在显示 Futura。我认为它是有效的，因为我假设名称中带有 Futura 的网络字体看起来像经典的 Futura。但除了模糊的无衬线字体外，它看起来一点也不像 Futura。