<!DOCTYPE html>
<html>
<head>
<style type="text/css">
#box{
width: 100px;
height: 100px;
background: black;
margin: 100px;
border-radius: 50%;
position: relative;
animation: change 3s linear infinite;//change:相当于函数名 3s:3秒钟完成从0-360度旋转 linear:匀速 infinite:无限循环
}
#box2{
width: 30px;
height: 30px;
background: white;
border-radius: 50%;
position: absolute;
top: 20px;
left: 20px;
}
@keyframes change{
from{
transform: rotate(0deg);//rotate:旋转0度
}
to{
transform: rotate(360deg);//rotate:旋转360度
}
}
</style>
</head>
<body>
<div id="box">
<div id="box2"></div>
</div>
</body>
</html>
5879
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
