1、鼠标放在圆形图片中,图片渐渐的变方形【17素材头像的特效,觉得不错就研究下来了 ———— 17sucai.com】

img{border-radius:50%;transition: all .4s ease-out;}

a:hover img{border-radius:0px;}

2、当鼠标放到菜单或者图片上时,菜单或图片会渐渐的移动  【忘记在哪看的了,不过效果确实很不错】

a{transition:all 0.3s ease-out 0s;color:#000;}

a:hover{margin-left:5px; text-decoration:none;}

3、当鼠标放到图片上,图片会旋转一定的角度,【类似天猫首页右侧的便民服务,其实原理就是相同的背景图片】

i{        background: url(../images/lobg.png) no-repeat; width:30px; height:30px;}

i:hover{         background-position: 0 -30px;       transition: all .4s ease-out;}

现在网页中流行的css3样式的更多相关文章

  1. 修复Telerik reporting 在网页中使用时的样式

    在ASP.NET 网页或ASP MVC中嵌入Telerik Reporting时,报表出来的样式是有问题的,按扭的位置错位了. 在页面中引入以下CSS文件可以将报表样式修复从而回到正常的报表样式. . ...

  2. 【原】ZenCoding中常用的CSS3样式

    用ZenCoding这么久了,总结下常用CSS3的写法,方便以后查找: Property Alias @media print {} @m box-sizing:border-box; bxz:bb ...

  3. 【学】CSS3基础实例1 - 用CSS3做网页中的小三角,以及transition的用法

    自开了博客园已经有2周了吧,虽然转载了一些觉得比较有用的文章之外还没有开始写自己的一些学习记录,那就从今天开始. 目前看了妙味的不少视频,有css+html,js的基础和中级也都看完了,作业也都做了, ...

  4. php部分:网页中报表的打印,并用CSS样式控制打印的部分;

    网页中报表的打印,是通过调用window对象中的print()方法实现打印功能的: 调用浏览器本身的打印功能实现打印 <a href="#" onclick="wi ...

  5. 前端开发css实战:使用css制作网页中的多级菜单

    前端开发css实战:使用css制作网页中的多级菜单 在日常工作中,大家都会遇到一些显示隐藏类菜单,比如页头导航.二维码显示隐藏.文本提示等等......而这些效果都是可以使用纯css实现的(而且非常简 ...

  6. Ifvisible.js – 判断网页中的用户是闲置还是活动状态

    ifvisible.js 是一个跨浏览器.轻量级的方式,用户检查用户在浏览页面或正在与它进行交互.它可以处理活动状态,如在页面上空闲或活跃.您还可以使用 ifvisible.js 智能设置您的间隔,如 ...

  7. 网页中导入特殊字体@font-face属性详解

    @font-face是CSS3中的一个模块,他主要是把自己定义的Web字体嵌入到你的网页中. 语法规则 首先我们一起来看看@font-face的语法规则: @font-face { font-fami ...

  8. CSS网页中导入特殊字体@font-face属性详解

    @font-face是CSS3中的一个模块,他主要是把自己定义的Web字体嵌入到你的网页中. 语法规则 首先我们一起来看看@font-face的语法规则: @font-face { font-fami ...

  9. 1. svg学习笔记-在网页中使用svg

    在网页中使用svg有以下三种方式 1. svg归根结底来说是一种图像格式,虽然有别于jpeg,gif,png等位图图像格式,所以在网页中能嵌入图像的地方都可以嵌入svg,例如将svg文件设置为< ...

随机推荐

  1. chrome浏览器debugger 调试,有意思。

    JavaScript代码中加入一句debugger;来手工造成一个断点效果. 例子: ajax看看返回的数据内容,或者想知道js变量获取值是什么的时候. $.ajax({ type:"pos ...

  2. string 到 wstring的转换

    string 到 wstring的转换_一景_新浪博客     string 到 wstring的转换    (2009-08-10 20:52:34)    转载▼    标签:    杂谈    ...

  3. java快速排序1000万无序数组JVM-Xmx=256M 耗时2s

    自己动手写排序算法,快速排序是比较不好写的了~ import java.util.*; class Test{ public void quickSort(int[] arr,int low,int ...

  4. linux学习之(六)-主机名、网络IP的配置与查看

    设置Linux 本机IP有一个非常好用的命令就是setup命令,在Linux终端打入setup命令就会打开Linux配置窗口,如下图: . 在打开的窗口中通过上下键选择  Network config ...

  5. OC中ARC forbids explicit message send of release错误(转)

    ARC forbids explicit message send of'release' 很显然,是ARC的问题. 错误原因:在创建工程的时候点选了“Use Automatic Reference ...

  6. mongodb创建、更新、删除

    1.插入操作 user = {"username":"lcq","sex":"man"} db.user.insert( ...

  7. Android提高第十一篇之模拟信号示波器

    上次简单地介绍了AudioRecord和AudioTrack的使用,这次就结合SurfaceView实现一个Android版的手机模拟信号示波器(PS:以前也讲过J2ME版的手机示波器).最近物联网炒 ...

  8. sql2008中时间类型问题

    DATEDIFF (DD ,@sdate ,getdate() ) eg30 计算从开始日期到今天的天数 datename(weekday,@sdate) eg星期三 查询那一天是星期几 SQL Se ...

  9. DQL

    DQL(Data QueryLanguage) 基本格式 select * from 表名 对于列进行限制 格式一:取指定列 select 列1,列2 from 表名 格式二:为列起别名的三种表示法, ...

  10. nade.js(一)进程管理

    简介 process是一个全局内置对象,可以在代码中的任何位置访问此对象,这个对象代表我们的node.js代码宿主的操作系统进程对象. 使用process对象可以截获进程的异常.退出等事件,也可以获取 ...