CSS3---2D變換

transform

　　transition-origin：設定物件中變換所參考的原點

　　none:無變換

　　translate([,]):指定物件的2D translation（2D平移）。第一個參數對應X軸，第二個參數對應Y軸。如果第二個參數未提供，則預設為0.

　　　　translateX():指定物件X軸平移

　　　　translateY():指定物件Y軸平移

　　rotate():指定物件的2D rotation（2D 旋轉），需要現有transtion-origin屬性的定義

　　scale([,]):指定物件的2D scale（2D縮放）。第一個參數對應X軸，第二個參數對應Y軸。如果第二個參數未提供，則預設取第一個參數。

　　　　scaleX():指定物件X軸的（水平方向）縮放

　　　　scaleY():指定物件Y軸的（垂直方向）縮放

　　skew():指定物件的skew transformation（斜切扭曲）。第一個參數對應X軸，第二個參數對應Y軸。如果第二個參數未提供，則預設為0.

　　　　skewX():指定物件Y軸的（水平方向）扭曲

　　　　skewY():指定物件Y軸的（水平方向）扭曲

 

過渡：

transtion:[transtion-property]||[transtion-duration]||[transtion-timing-function]||[transtion-delay]

　　transtion-property:檢索或設定物件中的參與過渡的屬性 default

　　transtion-duration:檢索或設定物件過渡的持續時間

　　transtion-timing-function:檢索或設定物件過渡的動畫類型

　　transtion-delay:檢索或設定物件延遲過渡的時間

 

動畫：

animation:[animation-name]||[animation-duration]||[animation-timing-function]||[animation-delay]||[animation-iteration-count]||[animation-direction]

　　animation-name:檢索或設定物件所套用的動畫名稱

　　animation-duration:檢索或設定物件動畫的持續時間

　　animation-timing-function:檢索或設定物件動畫的過渡類型

　　animation-delay:檢索或設定物件動畫的延遲時間

　　animation-iteration-count:檢索或設定物件動畫的循環次數

　　animation-direction:檢索或設定物件動畫是否在循環中反向運動