- 鼠标悬停图片旋转，是可以用css3的hover伪类来实现鼠标移入元素发生变化的这么一个效果，利用这一特性巧妙地给伪类添加css3的旋转动画，这样就摒弃掉烦人且复杂的js简单的就实现
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>鼠标悬停图片360°旋转</title>
</head>
<style>
body{
background: #727272;
}
.xuanzhuan{
width: 280px;
height: 280px;
margin: 0 auto;
background: url(1_weixin_44484452.jpg) no-repeat;
border-radius: 50%;
transition: transform 2s ease-out;
}
.xuanzhuan:hover{
transform: rotateZ(360deg);
}
</style>
<body>
<div class="xuanzhuan"></div>
</body>
</html>
相关文章：
-
2021-11-08
-
2022-02-04
-
2021-07-09
-
2022-12-23
-
2021-11-01
-
2021-09-19
-
2022-12-23
-
2022-12-23