CSS中motion path模块的介绍
小妮浅浅
2021-07-02 16:45:054375浏览 · 0收藏 · 0评论
说明
1、利用这个规范规定的属性，我们可以控制元素按照特定的路径进行位置变换的动画。并且，这个路径可以是非常复杂的一条路径。
2、CSS传统方式可以实现直线路径动画。
实例
将一个物体从A点直线运动到B点，通常而言可以使用transform: translate()、top | left | bottom | right或者是margin之类的可以改变物体位置的属性。
<div></div>
div {
width: 60px;
height: 60px;
background: #000;
animation: move infinite 1s alternate linear;
}
@keyframes move {
100% {
transform: translate(100px, 100px);
}
}以上就是CSS中motion path模块的介绍，希望对大家有所帮助。更多css学习指路：css教程
关注公众号，随时随地在线学习
分享到微博
微信扫一扫
流芳
95477
