我正在尝试为 svg<path>元素设置动画。初始<path>元素具有L(lineto)命令，而<path>我尝试为其设置动画的元素具有C(cubic-bezier curve)命令。我尝试过对其进行动画处理，但它并没有真正在两条路径之间转换。这样的事情可能吗？
<svg>
<path id="path" d="M0,50 L25,40 L50,60 L75,40 L100,60 L125,40 L150,50" fill="none" stroke-width="2" stroke="#000" />
<animate xlink:href="#path"
attributeName="d"
dur="3s"
from="M 0 50 L 25 40 L 50 60 L 75 40 L 100 60 L 125 40 L 150 50"
to="M 0 80 C 25 55 50 55 75 80 C 100 105 125 105 150 80"
repeatCount="indefinite" />
</svg>我正在尝试为直升机叶片制作动画。我唯一的想法是沿 X 轴收缩和扩展刀片。为此，我正在为scale属性设置动画，但结果并不如预期。我猜这个问题是关于transform-origin？不知道如何解决这个问题，如果有人能帮忙就太好了。
<svg width="500" height="500" viewBox="0 0 500 500">
<g id="helicopter" transform="translate(0,0)">
<g transform="rotate(10 425.701 270.25)">
<path d="M452.992 256.303v4.547h-1.416l-2.435 9.914h8.814l-2.133-9.914h-1.312v-4.547zm1.252 27.766l-.695.475v2.377l-5.307.006a.858.858 0 000 1.716h23.242l.387-.1 3.096-1.7v-.006a.8.8 0 10-.795-1.385v-.004l-2.285 1.365-.412.113-4.934-.006v-2.318h-1.566v2.318h-9.854v-2.318z M425.701 270.25h42.348c8.82.017 10.296 13.596 0 14.352h-13.44c-4.794-.054-9.567-3.488-9.7-9.7l-20.315-2.173-1.944 3.617c-.443.672-1.027 1.005-1.8.881l.505-5.053v-2.43l-1.819-8.894c.921-.056 1.446.338 1.794.93z" style="fill:#121212"/>
<path id="blades" d="M481.292 257.313 H426.21 v3.032 l21.124 -.809 v-1.213 h12.835 v1.213 l21.124 .81z" style="fill:#aaaaaa;stroke-width:1px"/>
<animateTransform attributeName="transform" attributeType="XML" xlink:href="#blades" type="scale" values="1 1;0 1;1 1" keyTimes="0;0.5;1" dur="1s" begin="0.5s" repeatCount="indefinite"/>
</g>
</g>
<animateTransform attributeName="transform" attributeType="XML" xlink:href="#helicopter" type="translate" from="-600" to="200" …我有以下带填充的链接。在移动屏幕上，它有一个换行符。是否可以在第一行的末尾和第二行的开头添加填充？
div {
max-width: 30rem;
margin: 5rem auto;
}
a {
padding: 10px 20px;
background: red;
line-height: 200%;
}<div>
<a href="#">Read More: Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt</a>
</div>