一、蒙版

-webkit-mask
    顯示有顏色的地方

二、旋轉(zhuǎn)

  transform
            rotate()                Z軸旋轉(zhuǎn)
            rotateX()               X軸旋轉(zhuǎn)
            rotateY()               Y軸旋轉(zhuǎn)

透視

    transform: perspective(透視值); 
        值   推薦800-1200
            大   不明顯
            小   明顯
translate(x,y)          x軸y軸平移
translateZ()            Z軸平移

想要改變translateZ，那父級元素必須變成3D
    -webkit-transform-s tyle: preserve-3d;
    父級一定要透視
    如果父級有旋轉(zhuǎn)XY之類的
    -webkit-transform: perspective() rotateX/Y();
    如果父級什么都不需要
    perspective: 800px;

transform注意：
    1.執(zhí)行有順序(后面的先執(zhí)行)
    2.行元素有問題(不能操作行元素)

三、運動

transition: duration type-style timing-function delay;

（1）高級動畫

    animation
    定義一個動畫
        @keyframes name{
            from{}
            to{}
        }
    調(diào)用一個動畫
        animation: name duration ...;
    貝塞爾曲線
    cubic-bezier(x1,y1,x2,y2)
   （a）名字
    -webkit-animation-name: toBig;      
   （b）運動時長
    -webkit-animation-duration: 1s;
   （c） 運動類型
    -webkit-animation-timing-function: ease;
   （d）迭代次數(shù)  infinite 無限
    -webkit-animation-iteration-count: infinite;
   （e）方向        alternate
    -webkit-animation-direction: alternate;
    （f）播放狀態(tài)
    -webkit-animation-play-state: paused|running;
    （g）延遲
    -webkit-animation-delay:;
    （h）停在那
    -webkit-animation-fill-mode: backwards;