css3实现头像旋转功能(超easy!!!)
简单好玩的头像旋转功能
- html结构
<body>
<img src="https://a-ssl.duitang.com/uploads/item/201604/29/20160429003937_5YxXV.thumb.700_0.jpeg" alt="banben01">
</body>
- css样式
<style>
img{
display: block;
margin:100px auto;
width: 160px;
height: 160px;
border-radius: 50%;
border:6px solid #C0C0C0;
transition:all 500ms;
};
img:hover{
transform:rotate(320deg);
};
</style>
- 最终实现效果 逼王镇楼 (๑•ᴗ•๑)
Σ( ° △ °|||)︴ 弱鸡还不会录屏做GIF动图,懒得找啦!!
