SVG绝对定位

Tithos 发表于 Dev

提索斯

我是第一次玩svg。晚会晚了，但是很好。

我想在svg中制作一些愚蠢的动画，但是遇到了一些麻烦

这是我的代码的片段：http : //codepen.io/timbo27/pen/kAKJi

<div id="logo">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 200">
<g>
    <path class="logo-start" d="M59.1,66.6c0.2,0.2,0.4,0.3,0.4,0.6c0,0.3-0.3,0.7-0.6,0.7c-0.2,0-0.4-0.1-0.5-0.2l-4.9-3.3c-0.3-0.2-0.4-0.3-0.4-0.6
        c0-0.3,0.2-0.5,0.4-0.6l4.9-3.3c0.1-0.1,0.3-0.2,0.5-0.2c0.3,0,0.6,0.3,0.6,0.6c0,0.3-0.2,0.5-0.4,0.6l-4.3,2.8L59.1,66.6z"/>
    ......
    <path class="logo-stop" d="M161.4,63.7l-4.3-2.8c-0.2-0.2-0.4-0.3-0.4-0.6c0-0.3,0.3-0.6,0.6-0.6c0.2,0,0.3,0.1,0.5,0.2l4.9,3.3
        c0.3,0.2,0.5,0.3,0.4,0.6c0,0.3-0.2,0.5-0.4,0.6l-4.9,3.3c-0.1,0.1-0.3,0.2-0.5,0.2c-0.3,0-0.6-0.3-0.6-0.7c0-0.3,0.2-0.5,0.4-0.6
        L161.4,63.7z"/>
</g>
</svg>
</div>

基本上我有一个SVG徽标（纯文本）

我给每个路径都指定了一个类，并在其中一些路径上做了一些最小的样式化。

我希望能够绝对定位某些路径。

这可能吗？

谢谢

罗伯特·朗森

路径没有您发现的x / y属性或样式。

您可以添加transform="translate(x, y)"x，y为浮点数的属性，也可以添加CSS变换属性，尽管我不确定SVG元素对CSS变换有多少支持。

本文收集自互联网，转载请注明来源。

如有侵权，请联系 [email protected] 删除。