<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>练习</title> </ ...
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>练习</title> </head><style type="text/css"> * { margin: 0; padding: 0;}@keyframes minute { from { transform: rotate(0deg); } to { transform: rotate(360deg); }}@keyframes second { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }.time { width: 300px; height: 300px; border-radius: 50%; background: #F2D298; border:5px solid #F2D298; margin:0 auto; position: relative;}.minute { width: 10px; height: 100px; background-color: #F4EBEB; position: absolute; left: 150px; top: 60px; /*ainimation:name duration timing-function delay iteration-count direction;*/ animation: minute 3600s linear 0s infinite; transform-origin:5px bottom;}.second { width: 7px; height: 140px; background-color: #F4EBEB; position: absolute; left: 2px; top: -40px; animation:second 60s linear 0s infinite; transform-origin:2px bottom;}</style><body><!-- 实现钟表动画 --> <div class="time"> <div class="minute"> <div class="second"></div> </div> </div></body></html>以上是使用简单的css3动画实现的，有兴趣的朋友可以完善下，欢迎指点
海外公司注册、海外银行开户、跨境平台代入驻、VAT、EPR等知识和在线办理：https://www.xlkjsw.com
原标题：模拟钟表的转动
关键词：
*特别声明：以上内容来自于网络收集，著作权属原作者所有，如有侵权，请联系我们：
admin#shaoqun.com
（#换成@）。
