SVG水平卷曲支架

Question

我试图创建一个宽的水平花括号从键盘字符开始并转换它.

我开始时:

<text x="40" y="120" transform="rotate(90, 40, 120)">}</text>

现在我想扩展文本以使其更宽.忘记使用CSS font-size元素,font-weight的大小也会相应地改变,产生一个胖符号.

我想通过保持它变薄来拉伸角色.

然后我开始使用symbol和use组合,尝试利用该viewbox功能

这是我上次尝试的内容:

<symbol id="curly-bracket">
    <text>}</text>
</symbol>
<use x="40" y="120" transform="rotate(90, 40, 120)" xlink:href="#curly-bracket" />

角色现在看起来很切,我发现无法正确显示.

我很难理解我在做什么,阅读W3 SVG文档.

Answer 1

<text x="40" y="120" transform="rotate(90, 40, 120) scale(1,2)">}</text>

这将使所有y坐标加倍，并且由于将其旋转了90度，因此将水平拉伸。

尝试从W3规范中学习SVG会让您感到沮丧和困惑。它不是作为有关如何使用它的教程而编写的。这是有关SVG转换的大量资源。如果您对SVG真的很感兴趣，我建议您阅读整本电子书。我认为这是最好的资源。