现在网页中流行的css3样式
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样式的更多相关文章
- 修复Telerik reporting 在网页中使用时的样式
在ASP.NET 网页或ASP MVC中嵌入Telerik Reporting时,报表出来的样式是有问题的,按扭的位置错位了. 在页面中引入以下CSS文件可以将报表样式修复从而回到正常的报表样式. . ...
- 【原】ZenCoding中常用的CSS3样式
用ZenCoding这么久了,总结下常用CSS3的写法,方便以后查找: Property Alias @media print {} @m box-sizing:border-box; bxz:bb ...
- 【学】CSS3基础实例1 - 用CSS3做网页中的小三角,以及transition的用法
自开了博客园已经有2周了吧,虽然转载了一些觉得比较有用的文章之外还没有开始写自己的一些学习记录,那就从今天开始. 目前看了妙味的不少视频,有css+html,js的基础和中级也都看完了,作业也都做了, ...
- php部分:网页中报表的打印,并用CSS样式控制打印的部分;
网页中报表的打印,是通过调用window对象中的print()方法实现打印功能的: 调用浏览器本身的打印功能实现打印 <a href="#" onclick="wi ...
- 前端开发css实战:使用css制作网页中的多级菜单
前端开发css实战:使用css制作网页中的多级菜单 在日常工作中,大家都会遇到一些显示隐藏类菜单,比如页头导航.二维码显示隐藏.文本提示等等......而这些效果都是可以使用纯css实现的(而且非常简 ...
- Ifvisible.js – 判断网页中的用户是闲置还是活动状态
ifvisible.js 是一个跨浏览器.轻量级的方式,用户检查用户在浏览页面或正在与它进行交互.它可以处理活动状态,如在页面上空闲或活跃.您还可以使用 ifvisible.js 智能设置您的间隔,如 ...
- 网页中导入特殊字体@font-face属性详解
@font-face是CSS3中的一个模块,他主要是把自己定义的Web字体嵌入到你的网页中. 语法规则 首先我们一起来看看@font-face的语法规则: @font-face { font-fami ...
- CSS网页中导入特殊字体@font-face属性详解
@font-face是CSS3中的一个模块,他主要是把自己定义的Web字体嵌入到你的网页中. 语法规则 首先我们一起来看看@font-face的语法规则: @font-face { font-fami ...
- 1. svg学习笔记-在网页中使用svg
在网页中使用svg有以下三种方式 1. svg归根结底来说是一种图像格式,虽然有别于jpeg,gif,png等位图图像格式,所以在网页中能嵌入图像的地方都可以嵌入svg,例如将svg文件设置为< ...
随机推荐
- POJ 3104 Drying(二分答案)
[题目链接] http://poj.org/problem?id=3104 [题目大意] 给出n件需要干燥的衣服,烘干机能够每秒干燥k水分, 不在烘干的衣服本身每秒能干燥1水分 求出最少需要干燥的时间 ...
- 二叉查找树的Find,FindMin,FindMax的递归和非递归实现
typedef struct TreeNode *Position; typedef struct TreeNode *SearchTree; struct TreeNode{ ElementType ...
- Silk Mobile – 缩短移动应用的测试周期
Micro Focus已将从Borland接管的Silk Mobile™投放到市场,作为一种新的强大的移动应用测试解决方案,它将使企业能够开发出更先进更可靠的移动商业软件. 作为市场上最完整的移动应用 ...
- linux内核源码阅读之facebook硬盘加速flashcache之六
其实到目前为止,如果对读流程已经能轻松地看懂了,那么写流程不需要太多脑细胞.我觉得再写下去没有太大的必要了,后面想想为了保持flashcache完整性,还是写出来吧.接着到写流程: 1530stati ...
- android handler机制和Timer采用
Timer主要用于创建一个任务来定期运行. 创建继承Task该任务等级.即任务每次跑. private class MyTask extends TimerTask { @Override publi ...
- Eclipse和PyDev搭建python开发环境
Eclipse和PyDev搭建python开发环境 1.1整体目标 本文档作为python学习者的新手教程,通过本教程能够了解python用途.语法.在实际工作中的应 ...
- PHP和JAVASCRIPT判断访客终端是电脑还是手机
当用户使用手机等移动终端访问网站时,我们可以通过程序检测用户终端类型,如果是手机用户,则引导用户访问适配手机屏幕的移动站点.本文将介绍分别使用PHP和JAVASCRIPT代码判断用户终端类型. PHP ...
- java.lang.IllegalStateException: Target host must not be null, or set in parameters. scheme=null, host=null, path=Aict/listPagedAict.action
原因:请求的URL地址不完整,没有找到host. 排查解决:发现HTTP请求的URL少加了项目名,导致URL地址不完整.
- 十全大补DBA学习资源
学习oracle已经有1年多了,从开始的菜鸟到现在的DBA,一路走来~迷茫过.兴奋过.但我仍然会在DBA的道路上走下去!oracle要学的有很多,会遇到很多难题,网上有很多学习oracle好的学习资料 ...
- JAVA 可视化分析工具 第12节
JAVA 可视化分析工具 第12节 经过前几章对堆内存以及垃圾收集机制的学习,相信小伙伴们已经建立了一套比较完整的理论体系!那么这章我们就根据已有的理论知识,通过可视化工具来实践一番. 我们今天要讲 ...