CSS3变换入门（5）
作者：神飞 来源：前端观察 发布时间：2010-01-30 13:29:00
标签：css3,变换,入门,dhtml
变换计时与延迟
使用变换，你可以改变变换的速率，在开始的时候较慢然后在结束的时候加速，反之亦然，或者之间的任何事情。CSS变换有5个计时的关键词，同时也允许你自己定义你自己的计时曲线。
| 名称 | 如何工作 |
| cubic-bezier(x1, y1, x2, y2) | X 和 Y 值在0到1之间，以定义用于Time function的贝塞尔曲线的形状。 |
| linear | 均速 |
| ease | 逐渐慢下来 |
| ease-in | 加速(渐入) |
| ease-out | 减速(淡出) |
| ease-in-out | 加速然后减速 |
全部变换？
变换将很快成为所有网站的标准操作方式，从而增强用户界面的体验。
为了给你的整个网站添加一个普遍的变换，一个做法就是添加一个变换到全体选择器，类似CSS reset。下面的代码会给页面中的所有元素添加一个默认的变换，从而允许你保持一个统一的变换效果：
*:link, *:visited, *:hover, *:active, *:focus {
-webkit-transition:
color .25s linear,
background-color .25s linear,
border-color .25s linear;
transition:
color .25s linear,
background-color .25s linear,
border-color .25s linear;
}
一个反对全部变换，同时明确反对使用全体选择器作为CSS reset的争论是，将一个样式用到页面的所有元素会减缓页面的渲染。然而，我并没有发现任何有关与此的证据。有人知道吗？
OK，其实CSS 变换就这么简单，它并不难理解，而且你也不用些大量的JS脚本来实现它，这很方便实用，多做几次练习，你就可以熟练的使用它了。
译注：本文原文题目为 CSS transitions 101，101这个数字比较不好理解，其实美国大学第一门课程通常编号为101，所以101一般表示入门、初级的意思。另外关于 transition 这个词的翻译，我之前是翻译成“转换”，但是这个翻译很别扭，在twitter上和 @gaowhen、@ghostzhang、@ivane、@hiwanz、@cnjoel等人讨论后，觉得翻译成“变换”更合适一些，多谢各位。
译自：CSS transitions 101
中文：CSS3变换入门
原作者：Jason Cranford Teague
译者：神飞
请尊重版权，转载请注明出处，多谢！
0
投稿猜你喜欢
- 1.将以下代码加入到HEML的<body></body>之间<SCRIPT language=jav
- innerHTML,outerHTML innerHTML检索或设置标签内的内容；outerHTML检索或设置整个标签的内容（包含标签）。&
- 第一节：WAP的潜能 这些日子，我们常听到WAP技术，一种手机上网的技术。从技术上讲，移动电话不可能和PC来竞争，移动电话的屏幕只能容下很少
- 方法一 ：这个是我在站长工具的查询页面使用的防止频繁查询，刷新页面的代码！下面函数的功能是3秒内查询页面即刷新了页面，超过2次就提示！sea
启发式评估法（Heuristic Evaluation）是一种用来发现用户界面设计中的可用性问题从而使这些问题作为再设计过程中的一部分被重视- 那你也许会问及，怎样获取当前系统日期的最大时间值，如yyyy-MM-dd 23:59:59.997。 我们可以使用DATEADD函数，来实现
- 如果要问做什么事是最有吸引力，那就是创建Web应用。Web设计者们对设计交互式的Web没有什么更好的办法，却对我们做桌面软件的同事投去少许羡
- 以下代码已经在SQLServer2008上的示例数据库测试通过问题一：如何为数据进行加密与解密，避免使用者窃取机密数据？ 对于一些敏感数据，
- 检测是否注册成功<％ Set Jpeg =Server.CreateObject("Persi
- 开发过程中，错误免不了。为了纠正错误与规范化。可以使用MS SQL Server的系统存储过程sp_rename与OBJECTPROPERT
- vbscript脚本中，fso对象CreateTextFile方法调用时可能会报“无效的过程调用或参数”错误，在使用ASP生成静态页面时，如
- FCKeditor至今已经到了2.3.1版本了，对于国内的WEB开发者来说，也基本上都已经“闻风知多少”了，很多人将其融放到自己的项目中，更
- 我们在前面的几节中分别讲了提高网站性能中内容、服务器、JavaScript和CSS等方面的内容。除此之外，图片和Coockie也是我们网站中
- 今天在网上找了一下Microsoft Enterprise Library 5.0 如何集成MySQL数据库， 结果只找到了entlib 4
- 第一类人，用户体验无所不能。第二类人，用户体验无所不包括。第三类人，用户体验只是指导思想。用户研究通常是做创新的工作，也就注定只少数有财力、
- 编写思路:把本地文件在客户端通过base64编码以后发送目的地.测试过程中,上传文件过大,导致超时不成功.后来经过改善.把编码分段发送.测试
- 颜色的变化跟人类的智慧一样,是无穷的,每个阶段都会有流行的色彩,有属于一个时代的颜色!WEB2.0是一个概念,它宣扬,定位了一些东西,以用户
- 可以自动轮换的页签 tabs with auto play fucntion<html><head><meta
- 今天把Ext.js源码又读了一遍，不过这次比较认真。看完代码，有了不少收获也遇到不少问题。主要总结如下：1、document.execCom
- 据了解绝大多数开发人员对于索引的理解都是一知半解，局限于大多数日常工作没有机会、也什么没有必要去关心、了解索引，实在哪天某个查询太慢了找到查
