关于CSS:在@ font-face中使用SVG字体而不是TTF / EOT有什么好处?

Any advantage to using SVG font in @font-face instead of TTF/EOT?

我正在调查@ font-face声明中SVG字体的用法。 到目前为止,似乎只有Safari 4和Opera 10支持它。 Firefox 3.5不支持它,但是有一个错误报告,但是还没有提供修复(尽管有补丁程序)。

我想知道,在主要浏览器中使用@ font-face支持时,使用SVG字体格式代替TTF / OTF / EOT格式有什么优势? 我可以从上面的讨论中收集到的唯一好处是,您可以将自己缺少的字形添加到尚不支持它们的字体中。

还有其他理由在CSS中指定SVG字体吗?


这似乎是在Mobile Safari上使用网络字体的唯一方法。 因此,如果您正在为iPhone和iPad开发,那将是一个很大的优势。 Font Squirrel的@ font-face生成器可以从任何OpenType字体创建适当的SVG文件和CSS语法。


W3C指出了这些优点:

One disadvantage to the WebFont facility to date is that specifications such as [CSS2] do not require support of particular font formats. The result is that different implementations support different Web font formats, thereby making it difficult for Web site creators to post a single Web site using WebFonts that work across all user agents.

To provide a common font format for SVG that is guaranteed to be supported by all conforming SVG viewers, SVG provides a facility to define fonts in SVG. This facility is called SVG fonts.

SVG fonts can improve the semantic richness of graphics that represent text. For example, many company logos consist of the company name drawn artistically. In some cases, accessibility may be enhanced by expressing the logo as a series of glyphs in an SVG font and then rendering the logo as a 'text' element which references this font.

但是,由于缺乏浏览器支持,因此通用格式的意义并不重要。


svg webfonts不能在脱机webapp中使用。 您可以在此处查看示例:http://straathof.acadnet.ca/beta2.2将此文件保存到idevice主页,打开飞行模式并打开它。 svg字体和使用的命名系统导致字体url失败。

希望苹果能尽快解决。