演示文件：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<link rel="stylesheet" type="text/css" href="reset.css"/>
<style type="text/css">
#sz{
width: 400px;height: 400px;border-radius: 50%;
margin: 50px auto;
position: relative;
background: url(szbj.png) 0 0/100% 100%;
}
#sz img{
width: 100%;height: 100%;
position: absolute;left: 0;top: 0;
}
#szmz{
animation: sz 60s;
}
#szfz{
animation: sz 3600s;
}
#szsz{
animation: sz 43200s;
}
@keyframes sz{
0%{transform: rotateZ(0deg);}
100%{transform: rotate(360deg);}
}
</style>
</head>
<body>
<div id="sz">
<img id="szsz" src="szsz.png" >
<img id="szfz" src="szfz.png" >
<img id="szmz" src="szmz.png" >
</div>
</body>
</html>
