css3-动画样式

1 2D转换方法：

 translate()——移动
 rotate()——旋转，参数是角度，例如：180deg
 scale()——缩放(宽度，高度)，参数都是以倍数的形式（1,2）
 skew()——倾斜效果
 matrix() ——矩阵

.div2{
    transform: translate(100px,100px);

    /*如果浏览器不支持该效果,可以设定浏览器名称*/
    -webkit-transform:trans/late(100px,100px);/* safari  chrome*/
    -ms-transform: translate(100px,100px);/* IE */
    -o-transform: translate(100px,100px);/* opera  */
    -moz-transform:  translate(100px,100px);/* 火狐  */
}
.div2{
    transform: rotate(100deg);
    -webkit-transform: rotate(100deg);
    -ms-transform: rotate(100deg);
    -o-transform: rotate(100deg);
    -moz-transform: rotate(100deg);
}
.div2{
    margin-top: 200px;
    transform: scale(1,2);
    -webkit-transform:scale(1,2);
    -ms-transform:scale(1,2);
    -o-transform: scale(1,2);
    -moz-transform: scale(1,2);
}
/*

.div2{
    transform: skew(50deg,50deg);
    -webkit-transform:skew(50deg,50deg);
    -ms-transform:skew(50deg,50deg);
    -o-transform: skew(50deg,50deg);
    -moz-transform: skew(50deg,50deg);
}

2 3D转换方法：

 rotateX（）
 rotateY()

.div2{
    transform: rotateY(120deg);
    -moz-transform: rotateY(120deg);
}