现在网页中流行的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文件设置为< ...
随机推荐
- OpenStreetMap(OSM) for developers
This article from: http://wiki.openstreetmap.org/wiki/Develop OpenStreetMap isn't just open data - i ...
- 普里姆(Prim)算法
/* 普里姆算法的主要思想: 利用二维数组把权值放入,然后找在当前顶点的最小权值,然后走过的路用一个数组来记录 */ # include <stdio.h> typedef char Ve ...
- dhtmlgrid修改,支持IE10
因为项目IE升级,导致原来使用的dhtmlgrid无法正常显示,同时通过loadxml接口还有属性不支持. 花了半天时间对dhtmlgrid进行了修改,能够支持IE10正常加载显示. edit by ...
- 网易云课堂_程序设计入门-C语言_第五周:函数_2完数
2 完数(5分) 题目内容: 一个正整数的因子是所有可以整除它的正整数.而一个数如果恰好等于除它本身外的因子之和,这个数就称为完数.例如6=1+2+3(6的因子是1,2,3). 现在,你要写一个程序, ...
- 如何在TableView上添加悬浮按钮
如果直接在TableVIewController上贴Button的话会导致这个会随之滚动,下面解决在TableView上实现位置固定悬浮按钮的两种方法: 1.在view上贴tableView,然后将悬 ...
- UITableView进阶,cell刷新,界面返回 保持所选cell
1.cell 刷新 NSIndexPath *indexPath_1=[NSIndexPath indexPathForRow:1 inSection:0]; NSArray *indexArray= ...
- Train Problem II(卡特兰数+大数乘除)
Train Problem II Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others) ...
- The Tips of Success(成功的建议)
1.Do one thing at a time,and do well. 2.Never forget to say "thanks". 3,Keep on going.Neve ...
- Android基础之CountDownTimer 倒计时类
app常用的60s倒计时计时功能: private static final int TIME_LIMIT = 60; private void initView() { // 相关控件 mResen ...
- CentOS6.4下搭建hadoop2.2(64bit)注意事项
注:本文针对64位机器,32bit课直接tar -zxvf hadoop-2.2.0.tar.gz 解压配置即可. Step1:安装jdk(6以上版本) Step2:下载hadoop--->ht ...