SVG字体声明中的哈希符号是否必要？

Question

@font-face
  font-family: 'AllerRegular'
  src: url('/fonts/aller/aller_rg-webfont.eot')
  src: url('/fonts/aller/aller_rg-webfont.eot?#iefix') format('embedded-opentype'), url('/fonts/aller/aller_rg-webfont.woff') format('woff'), url('/fonts/aller/aller_rg-webfont.ttf') format('truetype'), url('/fonts/aller/aller_rg-webfont.svg#AllerRegular') format('svg')
  font-weight: normal
  font-style: normal

在上面的示例中，我正在添加此字体的SVG版本，但我不确定ID是否正确。如果此SVG中仅包含一个字体，是否有必要拥有正确的ID？

- user463231

---

尝试加上或不加上这个标签，这样是否能回答那个问题？ - Chris

我在想可能有人知道。我认为这些字体文件只用于iPad/iPhone，而我目前无法在任何设备上访问此应用程序。 - user463231

Answer 1

是的，这是必需的。 这篇文章说：

在上面的CSS代码中，您实际上可以看到SVG版本需要一些额外的信息，在文件名声明后面的井号(#)之后，即其ID。 如果您不填写它，它将无法工作，因此您需要在TXT文档或记事本中打开SVG文件，并查找接近页面顶部的以下行。

而这个则说：

对于SVG字体，它们也需要一个#哈希标签；

这个哈希标签只是指向在SVG内定义的字体ID的指针。 如果您不包括它，则整个SVG文件将被加载，包括防止识别字体的SVG标题。

- Chris

---

终于有人解释了，+1。 - Mark

假设你有一个路径，像是'fonts/thefont.svg#thefont' -- 你能否添加一个版本的GET变量，例如'fonts/thefont.svg#thefont?v=3.2.1'？我问这个问题是因为我无法在Chrome中加载带有GET变量的SVG字体。 - aendra

@aendrew 你可能需要交换你的URL部分，因为井号后面的所有内容都不会发送到服务器。所以尝试使用 thefont.svg?v=3.2.1#thefont。我没有测试过，但它更有可能起作用。 - Simon East

@Simon 你好，很遗憾这个不起作用。现代浏览器只需要WOFF字体，谢天谢地 - https://webmasters.stackexchange.com/questions/26992/if-i-have-only-woff-and-eot-what-browsers-am-i-supporting-with-font-face - Matt Rowles