SVG 字体的新语法是什么？

Question

我在浏览SVG字体在MDN，在那里，所提到<font-face>，<missing-glyph>，<hkern>并<vkern>计提折旧。只有<glyph>不折旧。它没有提及有关指定字体外观属性的推荐方法的任何内容。

在W3C的SVG建议，也没有说关于从提的是，一切都在指定SVG字体，除了的另一种方式什么<font-face>可以等效于CSS来实现。它没有为<hkern>或提供任何替代方案<vkern>。我打算创建一个独立的 SVG 文件，不被站点 CSS 修改，所以我想在 SVG 中保留整个字体定义。

那么，这种指定 SVG 字体的晦涩新方法是什么？

Answer 1

“SVG 字体”作为使用 SVG 标记定义字体资源的数据文件已被弃用；结果证明这是一个坏主意，最终没有解决网络上的排版需要解决的问题。它是在 SVG 1.1 中添加的，但在 SVG 2.0 中再次被删除，并且几乎所有最终添加对它的支持的浏览器都再次删除了该支持。

相反，所有浏览器现在都支持“webfonts”：使用“Web Open Font Format”（又名 WOFF/WOFF2）为 Web 打包的常规 OpenType 字体，基于 OpenType 格式，支持多种不同的轮廓类型：

• TrueType（二次曲线和复合字形，通常带有ttf扩展名，但扩展名实际上无关紧要）
• CFF/CFF2 中的 Type2（三次曲线和任意子程序，通常带有otf扩展名，但同样：扩展名完全无关）
• 嵌入位图（是的，OpenType 字体确实可以是真正的位图字体，根据需要使用尽可能多的不同位图来覆盖尽可能多的像素大小）
• SVG（这可能令人惊讶，但 SVG 是与 TT 和 CFF/CFF2 完全相同的矢量图形语言，因此也允许使用 SVG 指定字形轮廓数据是有意义的，特别是对于需要明确颜色的字体调色板，如表情符号字体）

因此，如果您绝对需要保留您的 SVG 数据，那么让自己成为带有 SVG 轮廓的 OpenType 字体，然后将其打包为现代 WOFF2（或较旧的 WOFF）用于网络，您就可以开始使用了。有很多在线工具可以为您做到这一点，但是如果您想要一种仅包含您需要的字体而不是在线工具强加给它们的字体，您也可以使用开源FontForge应用程序之类的工具。