在嵌入HTML页面的SVG对象中使用Adobe TypeKit字体

时间:2013-09-09 00:19:46

标签: javascript html css svg webfonts

如何在嵌入HTML页面的SVG对象中使用Adobe TypeKit中的字体?

我可以直接使用网络字体(例如,通过谷歌样式表:http://fonts.googleapis.com/css?family=Spicy+Rice),但TypeKit使用不同的基于JavaScript的加载策略,似乎没有应用字体可用性到SVG对象。

这是可能的,如果可以的话,我该如何去做呢?

谢谢!

1 个答案:

答案 0 :(得分:2)

SVG可以使用CSS样式表进行样式处理,因此您应该能够以这种方式应用它。

只要字体在页面上注册,您就可以使用textElToApplyFontTo.attr({ "font-family": "myFont" });

请注意,IE< 9可能会出现问题,我对VML字体支持了解不多。 IE9 +具有SVG支持,因此它应该与它以及所有其他现代[桌面]浏览器一起使用。

要考虑的一件重要事情是Typekit和其他基于JS的加载机制异步工作,因此字体只有在加载后才可用。

一些现代浏览器不会加载字体,除非DOM元素正在使用它,因此也可能导致问题(您可以尝试通过在DOM元素上使用它来加载字体,最好是在SVG文件之上一个肮脏的把戏,但它的作用......)。