變形包括2d變形和3d變形
transform2D變形
transform(none|<transform-function>+)，可以寫多個(gè)方法一起
但是要注意各個(gè)動(dòng)作的先后順序腕让，因?yàn)樽冃螘r(shí)會(huì)變動(dòng)元素的X务荆、Y軸。
rotate旋轉(zhuǎn)
rotate:<angle>
none為默認(rèn)值懦趋，無旋轉(zhuǎn)
angle值為角度角度值，順時(shí)針為正疹味，逆時(shí)針為負(fù)
例：transform:rotate(30deg);仅叫，意為以中心點(diǎn)為基準(zhǔn)旋轉(zhuǎn)30度（基準(zhǔn)可以變動(dòng)）帜篇。x、y軸在左上角诫咱，坐標(biāo)0笙隙，0
translate移動(dòng)
translate(<translation-value> [<translation-value>]?)
等價(jià)于
translateX(<translation-value>)
translateY(<translation-value>)
可以是百分比，也可以是絕對(duì)值可以是負(fù)值
例：transform:translate(50% 50%);坎缭，意為向右移動(dòng)50%竟痰，向下移動(dòng)50%。
scale縮放
scale(<number>[,number>]?)意為可以有2個(gè)值掏呼，以逗號(hào)分隔坏快，相等則可省
等價(jià)于
scaleX(<number>)
scaleY(<number>)
例：transform:scale(1 , 1.2);，意為以中心點(diǎn)為基準(zhǔn)憎夷，在X軸放大1倍（不變）假消，在Y軸放大1.2倍。
skew傾斜（壓扁或拉伸）
skew(<angle>[,<angle>]?)岭接，若第二個(gè)軸缺省時(shí)為默認(rèn)值0deg
等價(jià)于
skewX(<angle>)Y軸向X軸的正方向傾斜（正值時(shí)）
skewY(<angle>)X軸向Y軸的正方向傾斜（正值時(shí)）
變動(dòng)的是物體的X、Y軸
例：transform:skew(30deg 15deg);臼予，意為以中心點(diǎn)為基準(zhǔn)y軸向x軸正方向傾斜30度鸣戴，y軸向x軸正方向傾斜15度。
transform-origin改變動(dòng)作基點(diǎn)（較多用于旋轉(zhuǎn)）
transform-origin:
[left|center|right|top|bottom|<percentage>|<length>]
|[left|center|right|<percentage>|<length>][top|center|bottom|<percentage>|<length>]<length>?
|[center|[left|right]]&&[center|[top|bottom]]<length>?
可以是三組值中的任意一組：
第一組是指關(guān)鍵字
第二組是分別設(shè)置X粘拾、Y窄锅、Z三個(gè)軸（Z軸只有長(zhǎng)度）
第三組是分別設(shè)置X、Y缰雇、Z三個(gè)軸上的關(guān)鍵字
例：transform-origin:50% 50%;入偷，意為以x軸的50%、y軸的50%位置進(jìn)行旋轉(zhuǎn)械哟。當(dāng)值缺省時(shí)為默認(rèn)值50%
perspective透視
perspective:none|<length>;疏之，none為默認(rèn)值，無透視效果暇咆，默認(rèn)以中心點(diǎn)為基準(zhǔn)锋爪，長(zhǎng)度為離開基準(zhǔn)的距離，值越大透視效果越不明顯
perspective-origin爸业，改變基準(zhǔn)其骄，與transform-origin一樣
translate3d()3d移動(dòng)
比translate多一個(gè)z軸參數(shù)，值為數(shù)值扯旷，正值靠近拯爽，負(fù)值遠(yuǎn)離（在視覺效果上近大遠(yuǎn)小）钧忽。
scale3d()3d縮放
與其他動(dòng)作結(jié)合時(shí)注意先后順序毯炮，先縮放的話有倍率效果
rotate3d()3d旋轉(zhuǎn)
rotate3d(<number>,<number>,<number>,<angle>);
前三個(gè)值用三維坐標(biāo)選取旋轉(zhuǎn)點(diǎn)逼肯，以該點(diǎn)與坐標(biāo)原點(diǎn)的連線作為旋轉(zhuǎn)軸進(jìn)行旋轉(zhuǎn)
元素變形嵌套
還需要增加設(shè)置是否扁平化，因?yàn)樵卦O(shè)置了3d變形后默認(rèn)設(shè)置其內(nèi)部元素進(jìn)行了扁平化否副，取消了3d變形
transform-style:flat|preserve-3d;
flat為默認(rèn)值汉矿，扁平化
preserve-3d為保留3d空間
元素反轉(zhuǎn)后背面是否可見的設(shè)定
backface-visibility:visible|hidden;
為3d元素的背面是否可見的設(shè)定，默認(rèn)為可見的
用于元素旋轉(zhuǎn)組合之后的單個(gè)顯示的設(shè)定
