微信小程序动画专题课程-通过wxss(css)来实现-第7课-animation-delay属性

animation-delay: time;

<view>animation-delay 规定动画何时开始。默认是 0。</view>

<view class='c01'>01</view>

<image src='/images/logo.png' class='c02'></image>

.c01{

width:100px;

height:100px;

background:red;

position:relative;

animation:mymove 5s infinite;

animation-delay:2s; /* animation-delay  规定动画何时开始。默认是 0。 */

}

@keyframes mymove

{

from {left:0px;}

to {left:200px;}

}

.c02{

width: 100px; height: 100px;

position:relative;

animation:mymove2 5s infinite;

animation-delay:1s; /* animation-delay  规定动画何时开始。默认是 0。 */

}

@keyframes mymove2

{

from {left:0px;}

to {left:200px;}

}