Question

在前面两章中，我们学习了一些CSS3的新特性和新功能。不过到目前为止，我们看到的所有效果都是静态的。其实CSS3能做的远不止于此。

目前的情况是，如果页面上需要一些动画效果，要么你自己编写JavaScript，要么使用JavaScript框架（如jQuery）来提高效率。但是，一些熟悉CSS3的同志早就看不惯动不动就用JavaScript的做法了，他们正想方设法收复失地。虽然CSS3不可能在短期内取代jQuery或类似的框架，但它完全有能力做一些如平滑过渡（比如在鼠标悬停时）和在屏幕上移动元素之类的事情。这对我们来说是个好消息，它意味着在越来越多支持现代浏览器的设备中，我们可以使用CSS替代JavaScript实现动画效果。好吧，我的意思是：你完全可以从“待办事项”中将“学习如何使用jQuery制作动画效果”这项划掉，因为用纯CSS能完成同样有趣的效果。和之前一样，不支持这些特性的浏览器不会受到任何影响，它们会自动跳过无法识别的规则，就好像这些代码根本不存在一样。

本章内容

什么是CSS3过渡以及如何使用它

如何编写CSS3过渡以及它的缩写语法

CSS3过渡时间函数（ease、cubic-bezier等）

响应式网站中有趣的过滤效果

什么是CSS3变换以及如何使用它

理解不同的2D变换（scale、rotate、skew，、translate等）

尝试3D变换

CSS3动画效果（使用关键帧）