武林網(www.49028c.com)文章簡介：CSS3教程:Transform-變形處理.

transform：使用transform功能實現四種文字或圖像的變形處理，分別是旋轉、縮放、斜切以及移動。

none： 無轉換

matrix(<number>,<number>,<number>,<number>,<number>,<number>)： 以一個含六值的(a,b,c,d,e,f)變換矩陣的形式指定一個2D變換，相當于直接應用一個[a,b,c,d,e,f]變換矩陣

translate(<length>[, <length>])：

移動，水平方向的移動和垂直方向的移動-mo-transform:translate(20px,10px).只用一個值的話，只指在水平方向的移動。

指定對象的2D translation（2D平移）。第一個參數對應X軸，第二個參數對應Y軸。如果第二個參數未提供，則默認值為0

translateX(<length>)： 指定對象X軸（水平方向）的平移

translateY(<length>)： 指定對象Y軸（垂直方向）的平移

rotate(<angle>)：

-webkit-transform:rotate(45deg);使用rotate，在參數中加入角度值，角度值后面跟著表示角度單位的“deg”文字即可，旋轉方向為順時針旋轉。

指定對象的2D rotation（2D旋轉），需先有transform-origin屬性的定義

scale(<number>[, <number>])：

-webkit-transform：scale（0.5）使該元素縮小了50%

-webkit-transform：scale（0.5，2）使該元素水平方向縮小了50%，垂直方向放大一倍

指定對象的2D scale（2D縮放）。第一個參數對應X軸，第二個參數對應Y軸。如果第二個參數未提供，則默認取第一個參數的值

scaleX(<number>)： 指定對象X軸的（水平方向）縮放

scaleY(<number>)： 指定對象Y軸的（垂直方向）縮放

skew(<angle> [, <angle>])：傾斜

-webkit-transform：skew（30deg）水平方向傾斜角度30deg

-webkit-transform：skew（30deg，30deg）使該元素水平方向縮小了50%，垂直方向放大一倍

指定對象skew transformation（斜切扭曲）。

第一個參數對應X軸，第二個參數對應Y軸。如果第二個參數未提供，則默認值為0

skewX(<angle>)： 指定對象X軸的（水平方向）扭曲

skewY(<angle>)： 指定對象Y軸的（垂直方向）扭曲