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

Use Adobe TypeKit fonts in an SVG object embedded in an HTML page

本文关键字：Adobe 字体 TypeKit 对象 HTML SVG      更新时间：2023-09-26

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

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

这是否可能，如果是，我该如何去做？

谢谢！

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

而且只要在

页面上注册了字体，就可以使用textElToApplyFontTo.attr({ "font-family": "myFont" });

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

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

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

相关文章：