CSS3中的transform:rotate()可以实现旋转功能,效果如网站图标。
1 <!DOCTYPE html> ??2 <html> ??3 ????<head> ??4 ????????<meta charset="UTF-8"> ??5 ????????<title></title> ?6 ????????<style type="text/css"> ??7 ????????????img{ ??8 ????????????????border: #000 solid 2px; ??9 ????????????????display: block; ?10 ????????????????margin: 50px auto; ?11 ????????????????border-radius: 50%; ?12 ????????????????transition: all 2.0s; ?13 ????????????} ?14 ????????????img:hover{ ?15 ????????????????transform: rotate(360deg); ?16 ????????????} ?17 ????????</style> ?18 ????</head> ?19 ????<body> ?20 ????????<img src="https://pic.cnblogs.com/avatar/1313420/20180111055446.png" /> ?21 ????</body> ?22 </html> ?
CSS3实现头像旋转
原文地址:https://www.cnblogs.com/qingdaer/p/8279659.html