我想在HTML中使用字体太棒了中的单个字形。我想要创建没有外部依赖项的style文件,所以我希望@font-face声明和字符的SVG定义是HTML文件的组成部分。
下面是我尝试过的(小提琴),但是没有出现自定义的字形:
<!DOCTYPE html>
<head>
<style>
@font-face {
font-family: "Custom";
src: local("Custom"), url("fonts.svg#font") format("svg");
}
a {
text-decoration: none;
font-family: Custom;
}
</style>
</head>
<body>
<svg
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
display="none">
<defs>
<font id="font">
<font-face font-family="Custom" />
<glyph
glyph-name="undo"
unicode="@"
d="m857 350q0-87-34-166t-91-137-137-92-166-34q-96 0-183 41t-147 114q-4 6-4 13t5 11l76 77q6 5 14 5 9-1 13-7 41-53 100-82t126-29q58 0 110 23t92 61 61 91 22 111-22 111-61 91-92 61-110 23q-55 0-105-20t-90-57l77-77q17-16 8-38-10-23-33-23h-250q-15 0-25 11t-11 25v250q0 24 22 33 22 10 39-8l72-72q60 57 137 88t159 31q87 0 166-34t137-92 91-137 34-166z" horiz-adv-x="857.1" />
</font>
</defs>
</svg>
<a href="#undo">@</a>
</body>
</html>我遗漏了什么或者错了什么?还是我想做一些不受支持的事情?
发布于 2015-10-29 21:53:09
你用什么浏览器来做这件事?你的小提琴在Safari很好用。
通过字体从MDN查看这个
SVG字体目前只支持Safari和Android浏览器。Internet还没有考虑实现这个功能,它的功能已经从Chrome 38 (和Opera 25)中删除,Firefox已经无限期地推迟了它的实现,以便集中精力在WOFF上。不过,其他工具,如插件、Batik和Inkscape的部分支持SVG字体嵌入
https://stackoverflow.com/questions/33424398
复制相似问题