css 动画
<div class="animate"> div</div>
css:
.animate{ width:30px; height:60px; background:red; animation:anima 2s linear forwards; } @keyframes anima { 0%{ transform:translateX(300px); }
100%{ transform:translateX(500px); }
}
animation 动画属性,其属性值 animation: 动画名称(必要) 动画时间(必要) 动画变化速度(必要) 多久开始执行动画 动画循环次数 动画方向;
@keyframes 动画名称 要执行动画的效果
0%动画开始
100%动画结尾