3d旋转：

        rotateZ();

rotate3d(x,y,z,度数)

注：x y z一个矢量值  0 不旋转   1 旋转

            eg:rotate3d(1,1,0,45deg)

等价于：rotateX(45deg) rotateY(45deg)

-->

<!--  

3d-缩放：

        scaleZ()

        scale3d(x,y,z)

-->

<!--  

让背面不可见：

        backface-visibility:hidden;

-->

<!--  

横看成岭侧成峰，远近高低各不同

不识庐山真面目，只缘身在此山中

会当凌绝顶，一览众山小

近大远小->景深

perspective景深：  值越大距离越远 ( 给父元素添加 )

-->

<!--  

    perspective:500px;     900 - 1200

景深的视角：

    perspective-origin:

中间：center

左上角: left top

                right top

                10px 10px

-->

<!--  

css3 -动画！

1：制作关键帧

@keyframes动画名称{

/*开始*/

            from{

                left:0;

            }

/*结束*/

            to{

                left:500px;

            }

        }

@keyframes动画名称{

            0%{

            }

//中间可以添加任意关键帧

            20%{

            }

            50%{

            }

            70%{

            }

            100%{

            }

        }

2:调用关键帧：

简写方式：

        animation:

动画的名称

动画的时间

延迟时间

动画的类型

动画循环的次数（无限循环：infinite）

动画运动的方向（reverse   alternate[先正后反]   alternate-reverse[先反后正])

运动的状态：animation-plat-state : running  paused(暂停)

动画停止的状态:  animation-fill-mode:forwards (停在最后一帧);

动画的类型：

linear匀速

ease默认值

step-start:马上跳到动画每一结束桢的状态

-->

<!--  

transition和 animation的区别：

transition需要事件触发（例如：鼠标滑过）

animation：自动触发

-->