首页 博客模板 网站素材 工具下载 建站教程 个人博客 生活咨询 博客大全

纯css3鼠标经过图片或者某个div板块来回旋转

返回首页 浏览次数:
建华兄
微信号:S411998413 2018-06-08
1kb代码就能实现鼠标经过图片或者某个div板块旋转,代码如下:
<html>
<head>
<meta charset="UTF-8">
<title>CSS3旋转</title>
<style>
img{
    -webkit-transition: 0.4s;
    -webkit-transition: -webkit-transform 0.4s ease-out;
    transition: transform 0.4s ease-out;
    -moz-transition: -moz-transform 0.4s ease-out;
}
 
img:hover{
    transform: rotateZ(360deg);
    -webkit-transform: rotateZ(360deg);
    -moz-transform: rotateZ(360deg);
}
</style>
</head>
<body>
<center><img src="pic15.jpg"></center>
</body>
</html>
下面是运行代码,将鼠标滑过图片查看效果

 

转载请注明本文转自建华兄个人博客http://www.jianhuax.com/jzjs/117.html
热门排行