Question

我正在尝试加载此自定义字体，但无法让它在我的服务器上运行。我只是提供静态文件。这是我正在使用的确切语法，它在我的本地机器上完美运行。

@font-face {
  font-family: "Telegrafico";
  src: url('/assets/fonts/telegrafico.woff') format('woff'), url('/assets/fonts/telegrafico.eot') format('embedded-opentype'), url('/assets/fonts/telegrafico.ttf') format('truetype'), url('/assets/fonts/telegrafico.svg') format('svg');
}

所有浏览器都存在问题......我无法弄清楚我的生活有什么不妥。

感谢任何帮助！

Answer 1

来自我们的聊天。

您在CSS中使用绝对URL。但是在现场，您的站点是从子目录提供的。（此处的错误是您的本地站点模型与实时环境不匹配）

解决方案是在CSS中使用相对路径而不是绝对路径。

假设/ assets / css和/ assets / fonts

@font-face {
  font-family: "Telegrafico";
  src: url('../fonts/telegrafico.woff') format('woff'), url('../fonts/telegrafico.eot') format('embedded-opentype'), url('../fonts/telegrafico.ttf') format('truetype'), url('../fonts/telegrafico.svg') format('svg');
}

应该足够了

远程的@ font-face问题

1 个答案: