lengthadjust
lengthadjust
当一个SVG <text>或<tspan>元素具有特定的长度时,使用该textLength属性进行设置。lengthAdjust属性控制如何将文本拉伸或压缩到该长度。
该属性的两个可能值是spacing
和spacingAndGlyphs
。使用spacing
(默认),字母格式被保留,但它们之间的空格可能会增大或缩小。使用时spacingAndGlyphs
,整个文本元素被拉伸到文本的方向。
使用lengthAdjust的SVG文本拟合
HTML内容
<svg width="300" height="150" xmlns="http://www.w3.org/2000/svg">
<g font-face="sans-serif">
<text x="0" y="20" textLength="300" lengthAdjust="spacing">
Stretched using spacing only.
</text>
<text x="0" y="50" textLength="300" lengthAdjust="spacingAndGlyphs">
Stretched using spacing and glyphs.
</text>
<text x="0" y="80" textLength="100" lengthAdjust="spacing">
Shrunk using spacing only.
</text>
<text x="0" y="110" textLength="100" lengthAdjust="spacingAndGlyphs">
Shrunk using spacing and glyphs.
</text>
</g>
</svg>
结果