css样式:

.div a img{
width: 88px;
height: 88px;
border-radius: 88px;
transition: all 1.2s ease-out 0s;
}
.div a img:hover{
-webkit-transform:rotate(360deg);
-moz-transform:rotate(360deg);
-o-transform:rotate(360deg);
-ms-transform:rotate(360deg);
transform:rotate(360deg);
}

html:

<div class="div">
<a href="#"><img src="data:images/logo.jpg"></a>
</div>

css3实现头像旋转360度的更多相关文章

  1. C# 图片旋转360度程序

    这几天开发一个程序,需要将一个图片旋转360度然后每一个角度保存下来.刚开始本来想着是让美工弄的,但是让一个美工手动转360度,她会喷你一脸. using System; using System.C ...

  2. css3实现头像旋转功能(超easy!!!)

    简单好玩的头像旋转功能 html结构 <body> <img src="https://a-ssl.duitang.com/uploads/item/201604/29/2 ...

  3. css3+jq--小箭头旋转180度案例

    html: <aside class="tea_getBtn"> <div class="w"> <span class=&quo ...

  4. transition过度效果 + transform旋转360度

    css样式: .animate{ width:65px; height:40px; background:#92B901; color:#ffffff; position:absolute; font ...

  5. 低调奢华 CSS3 transform-style 3D旋转

    点击这里查看效果:http://keleyi.com/a/bjad/s89uo4t1.htm 效果图: CSS3 transform-style 属性 以下是代码: <!DOCTYPE html ...

  6. css3 向上淡入 小图标翻转 360度旋转

    代码 <!DOCTYPE HTML> <html> <style type="text/css"> div { border: 1px soli ...

  7. html5人物图片360度立体旋转

    体验效果:http://hovertree.com/texiao/html5/10.htm 下载:http://hovertree.com/hvtart/bjae/t16oddyt.htm 代码如下: ...

  8. 通过CSS3实现:鼠标悬停图片360度旋转效果

    效果很好玩,代码很简单: 效果: 鼠标放置在图片上:360度顺时针旋转 鼠标离开图片:图片260度逆时针旋转 只要将下面代码拷贝过去,并将图片改成你想要的就可以看到效果 <!doctype ht ...

  9. 360度3D 旋转插件

    Circlr插件是一款基于jQuery的可以对图片进行360度全方位旋转展示的插件.Circlr通过按一定角度规律拍摄的产品图片,制作出可以使用鼠标拖动.鼠标滚轮和移动触摸来进行图片逐帧旋转的效果.比 ...

随机推荐

  1. SVG学习笔录(二)

    一.svg动画SMIL SVG采用的是使用文本来定义图形,这种文档结构非常适合于创建动画.要改变图形的位置.大小和颜色,只需要调整相应的属性就可以了.事实上,SVG有为各种事件处理而专门设计的属性,甚 ...

  2. Thinkphp框架下对某个字段查询数据的时候进行唯一过滤,返回唯一不同的值

    方法一. DISTINCT 方法用于返回唯一不同的值 . *distinct方法的参数是一个布尔值. 用法: $data = $Model->Distinct(true)->field(' ...

  3. 转利用python实现电影推荐

    “协同过滤”是推荐系统中的常用技术,按照分析维度的不同可实现“基于用户”和“基于产品”的推荐. 以下是利用python实现电影推荐的具体方法,其中数据集源于<集体编程智慧>一书,后续的编程 ...

  4. easyui_2----messager

    <script> $.messager.alert("这是头","这是内容"); </script> 必须放在 $(function() ...

  5. jdk 与jre

    1. 定义JRE(Java Runtime Enviroment)是Java的运行环境.面向Java程序的使用者,而不是开发者.如果你仅下载并安装了JRE,那么你的系统只能运行Java程序.JRE是运 ...

  6. Sublime Text3注册激活和部分配置

    1.  更改hosts文件(参照:sublime text3 破解方法,亲测有效) windows系统的hosts文件在C:\Windows\System32\drivers\etc在hosts文件中 ...

  7. python面向对象高级:Mixin多重继承

    继上一篇学习笔记:python面向对象的继承与多态,本篇就Mixin扩展类的方法写下学习笔记 Mixin Mixin编程是一种开发模式,是一种将多个类中的功能单元的进行组合的利用的方式,这听起来就像是 ...

  8. JavaScript之Function 和 Object 的区别和联系

    1.先看一个控制台的输出: instanceof 运算符字面意思是 左边是右边的一个实例吗? 但是这两条输出让人很困惑.Function 是 Object 的实例.Object 也是 Function ...

  9. is_link

    'Symbolic Link' to File1  content containing path to File1'Hard Link' to File1 content containing Fi ...

  10. 转:Java中字符串split() 的使用方法.

    原文地址:https://blog.csdn.net/qq_27093465/article/details/54910323 挺有意思的一个问题 先看下面的方法,事先预测一下,经过split方法,按 ...