html里c3动画是什么,动画序列.html

马云测试

body {

background-color: pink;

}

@keyframes move {

0% {

width: 200px;

height: 200px;

}

5% {

width: 800px;

}

10% {

width: 1600px;

}

15% {

width: 2400px;

}

20% {

width: 3200px;

}

25% {

width: 4000px;

}

30% {

transform: translate(4000px, 0);

width: 200px;

}

35% {

transform: translate(4000px, 400px);

height: 400px;

width: 200px;

}

40% {

}

45% {

}

50% {

}

55% {

}

60% {

}

65% {

}

70% {

}

75% {

}

80% {

}

85% {

}

90% {

}

95% {

}

100% {

}

}

img {

display: block;

width: 200px;

height: 200px;

background-color: skyblue;

border: 1px solid red;

/* animation-name: move;

animation-duration: 10s;

animation-iteration-count: infinite;

animation-direction: alternate; */

animation: move 10s 2 alternate;

}

一键复制

编辑

Web IDE

原始数据

按行查看

历史