知识点回顾

transition：css3中的过度属性，作用于目标元素。
 兼容性写法：div
{
width:100px;
transition: width 2s;
-moz-transition: width 2s; /* Firefox 4 */
-webkit-transition: width 2s; /* Safari 和 Chrome */
-o-transition: width 2s; /* Opera */
}
4个属性值：
    transition-property 规定设置过渡效果的 CSS 属性的名称。
    transition-duration 规定完成过渡效果需要多少秒或毫秒
    transition-timing-function 规定速度效果的速度曲线
    transition-delay 定义过渡效果何时开始
transform ：css3中的2d/3d转换
兼容性写法：div
{
transform:rotate(7deg);
-ms-transform:rotate(7deg);     /* IE 9 */
-moz-transform:rotate(7deg);     /* Firefox */
-webkit-transform:rotate(7deg); /* Safari 和 Chrome */
-o-transform:rotate(7deg);     /* Opera */
}
属性值：translate(x,y) translate3d(x,y,z) transform-origin: center;

animation： 动画效果
div
{
animation:mymove 5s infinite;
-webkit-animation:mymove 5s infinite; /* Safari 和 Chrome */
}
属性值;
    animation-name
    animation-duration
    animation-timing-function 规定动画的速度曲线。
    animation-delay 规定在动画开始之前的延迟
    animation-iteration-count 规定动画应该播放的次数
    animation-direction 规定是否应该轮流反向播放动画