CSS3圆形块鼠标悬浮/点触360度旋转特效

此代码仅供参考

---

代码说明

一款基于HTML5的CSS3特效，让div标签360度旋转，在鼠标悬停时旋转动作被激发，代码简洁，动画效果超好。

---

html代码

<style> .xuan{ transition:all 0.4s ease-in-out; -webkit-transition:all 0.4s ease-in-out; -moz-transition:all 0.4s ease-in-out; -o-transition:all 0.4s ease-in-out; /*属性变化时间快慢，这里特指div块的旋转速度快慢*/ width:200px; height:200px; background-color:#000000; display:inline-block; color:yellow; text-align:center; line-height:200px; font-size:20px; border:2px solid grey; border-radius:200px; outline:3px solid grey; } .xuan:hover { transform:rotate(360deg); -webkit-transform:rotate(360deg); -moz-transform:rotate(360deg); -o-transform:rotate(360deg); -ms-transform:rotate(360deg); /*鼠标悬浮时，div块发生360度旋转*/ } </style> <div class="xuan">360度旋转</div>

---

代码演示

---

---