这个动画效果怎么写
1 回答
慕森王
TA贡献1777条经验 获得超3个赞
<style>
#an{
width: 100px;
height: 100px;
background-color: #0a628f;
border-radius: 50%;
animation: myfirst 5s;
animation-iteration-count:infinite;
}
@keyframes myfirst
{
from {background: yellow;}
50%{
background-color: #000a28;
-webkit-transform: translate(200px);
-moz-transform: translate(200px);
-ms-transform: translate(200px);
-o-transform: translate(200px);
transform: translate(200px);
width: 200px;
border-radius: 20px;
}
to {
-webkit-transform: translate(300px);
-moz-transform: translate(300px);
-ms-transform: translate(300px);
-o-transform: translate(300px);
transform: translate(300px);
width: 200px;
height: 130px;
border-radius: 20px;
}
}
</style>
<body>
<div id="an"></div>
</body>
添加回答
举报
0/150
提交
取消