CSS3动画——雪碧图的实现

前言

作为一个前端的初学者，现在好像已经在nodejs上越跑越偏，之前一直崇拜的CSS3和HTML5动画，如今也好久没有管。因为之前学了好多知识点，但是没有系统的进行总结，就从这篇文章开始，对一些碎片的知识点做一些小小的总结吧，也算是一种回顾吧，这样自己也不会忘记。

先说CSS3的动画

CSS3关于动画的属性其实也不过就是这么几个，transform、transition、animation，这里简单的说一下每一个的使用方法，就不细说了，网上已经有无数多的例子讲这几个属性。
变换属性
transform：none | transform-function
transform-function 有很多：2D的，3D的

div
{
transform: rotate(30deg);
-ms-transform: rotate(30deg); /* IE 9 */
-webkit-transform: rotate(30deg); /* Safari and Chrome */
}

过渡属性
过渡属性很重要，你定义了一个变换，还需要定义过渡时间，才会看到效果
transition：single-transition

div
{
transit