一个简单的字体
一个简单的 svg 字体示例。这里有几点需要注意:
- 字形的坐标系与 svg 中的通常坐标系相对。 y 轴指向上方。点 0,0 位于右下角。
- 必须逆时针绘制字体中的所有路径。
- 在大多数工具中,仅支持字形元素的 d 属性。虽然技术上允许,但子元素不起作用。
<svg xmlns="http://www.w3.org/2000/svg">
<font id = "myFont"
horiz-adv-x = "1000"
vert-origin-x = "0"
vert-origin-y = "0" >
<font-face font-family = "myFont"
font-weight = "normal"
units-per-em = "1000">
<font-face-src>
<font-face-name name="myFont"/>
</font-face-src>
</font-face>`
<glyph unicode="a" d="M0 0 H1000 L500 1000z M200 200 L500 800 L800 200z" />
<glyph unicode="b" d="M0 0 H1000 L500 1000z M200 200 L500 800 L800 200z" />
</font>
</svg>
如果你有更宽或更窄的字形,只需更改字形元素本身的 horiz-adv-x 即可。
<glyph unicode="a" horiz-adv-x="512" d="M0 0 H1000 L500 1000z M200 200 L500 800 L800 200z" />
字体采摘
unicode 属性用于以后的字形选择。你可以使用简单的字母或 unicode 代码点以及连字(字母或 unicode 代码点的组合)
unicode="abc"
unicode="ab"
unicode="abab"
unicode="a"
unicode="b"
字符总是通过第一次匹配来选择,所以在任何单个字符之前都要有所有连字
unicode 代码点可以用十进制 {
或十六进制 
表示法编写。