2

我正在尝试使用 SVG 标准的字体元素。目前 Webkit 声称他们正确地实现了字体模块，但我无法让它与外部引用的 TTF 文件一起工作。

<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
  <defs>
    <font-face font-family="blabla">
      <font-face-src>
        <font-face-uri xlink:href="/path/to/font.ttf" />
      </font-face-src>
    </font-face>
  </defs>
  <text font-family="blabla">This doesn't work unfortunately</text>
</svg>

上面的示例不起作用，@font-face {}但是在 SVG 文档中使用嵌入的样式标记确实有效。我究竟做错了什么？（考虑将此 SVG 文档内联到 HTML5 文档中。）

如果这实际上是可能的，这是否也可以通过 JavaScript（字体加载）实现？

4

1 回答 1

1

从理论上讲，您的示例应该可以工作，但我认为<font-face-uri>除了 SVG 字体之外没有任何浏览器已经实现。造成这种情况的一个可能原因可能是 SVG 1.1 规范不需要其他字体格式，因此在 w3c 的 svg 测试套件中大部分测试都使用 SVG 字体格式。

但是使用 css @font-face 并没有错，所有支持 CSS 样式化 svg 内容的 svg 用户代理都需要对 @font-face 的支持，参见http://www.w3.org/TR/SVG11/fonts。 html#FontDescriptionsAlternatives。这包括所有当前发布的支持 svg 的网络浏览器。

于 2013-05-08T09:24:41.173 回答