html - 更改 SVG 路径的位置

标签 html css svg

我正在尝试使用动态值制作动画,并且我想更改路径的高度和位置。

例如我降低了灰色条的高度,将值 v473.9 更改为 v263.9,但希望保持元素的位置与底部对齐。

这是我的 codepen

<path id="SVGID_121_" d="
M213.8,74.6
l-8.2,6.5
l-43.8-15.6
c-3-1.7-7.8-1.7-10.8,0
L106.9,81
l-7.9-6.5
v263.9
h0
c0,1.1,0.8,2.2,2.2,3
l49.8,28.7
c3,1.7,7.8,1.7,10.8,0
l49.8-28.6
c1.5-0.9,2.3-2,2.2-3.2
h0
V74.6z"/>

最佳答案

https://codepen.io/IvanBisultanov/pen/wXPeQo 如果这是您想要实现的目标:我在您感兴趣的元素上添加了 translateY 210px

关于html - 更改 SVG 路径的位置,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50896524/

相关文章:

javascript - 多选择列表即时搜索正在工作,但需要保留 <optgroup> 标签

给定和计算的 CSS 对于 float 属性是不同的

php - 为什么 Laravel 将我重定向到登录页面,即使我仍然登录?

html - 图片url下载图片而不是显示图片

css - 自动居中的 div 内的图标字体呈现模糊/清晰基于浏览器宽度

html - CSS 继承对于选项卡无法正常工作

html - Twitter Bootstrap 3 pull-right 卡在小窗口上

javascript - Kartograph: map 创建失败

javascript - 如何复制整行?

html - 如何使用 CSS 设置复选框样式