就 SVG 文本而言,是否有替代字母间距的方法?
此代码适用于 Chrome 但不适用于 Firefox:
https://developer.mozilla.org/de/docs/Web/CSS/letter-spacing
如您所见,由于 bug,Firefox 现在不支持它。但我真的需要在两个浏览器中使用字母间距。那么 SVG 文本有好的替代方案吗?
顺便说一句,字间距也是如此。在 Chrome 中完美运行,但在 Firefox 中运行不佳。
最佳答案
letter-spacing
的替代方案在 Firefox 上有效,是 textLength
属性。也许这适合您作为解决方法?
<svg width="10cm" height="3cm" viewBox="0 0 1000 300"
xmlns="http://www.w3.org/2000/svg" version="1.1">
<desc>Example text01 - 'Hello, out there' in blue</desc>
<text x="250" y="150"
font-family="Verdana" font-size="55" fill="blue" >
Hello, out there
</text>
<text x="250" y="200" textLength="600"
font-family="Verdana" font-size="55" fill="blue" >
Hello, out there
</text>
<!-- Show outline of canvas using 'rect' element -->
<rect x="1" y="1" width="998" height="298"
fill="none" stroke="blue" stroke-width="2" />
</svg>
关于css - SVG 字母间距也适用于 Mozilla Firefox,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28644626/