CSS3添加了幾個動畫效果的屬性，通過設定這些屬性，可以做出一些簡單的動畫效果而不需要再去借助JavaScript。CSS3動畫的屬性主要分為三類：transform、transition以及animation。


transform
rotate
設定元素順時針旋轉的角度，用法是：
transform: rotate(x);
引數x必須是以deg結尾的角度數或0，可為負數表示反向。
scale
設定元素放大或縮小的倍數，用法包括：
transform: scale(a);                  元素x和y方向均縮放a倍
transform: scale(a, b);              元素x方向縮放a倍，y方向縮放b倍
transform: scaleX(a);                元素x方向縮放a倍，y方向不變
transform: scaleY(b);                元素y方向縮放b倍，x方向不變
translate
設定元素的位移，用法為：
transform: translate(a, b);                元素x方向位移a，y方向位移b
transform: translateX(a);                  元素x方向位移a，y方向不變
transform: translateY(b);                  元素y方向位移b，x方向不變
skew
設定元素傾斜的角度，用法包括：
transform: skew(a, b);              元素x方向逆時針傾斜角度a，y方向順時針傾斜角度b
transform: skewX(a);                元素x方向逆時針傾斜角度a，y方向不變
transform: skewY(b);                元素y方向順時針傾斜角度b，想方向不變
以上的引數均必須是以deg結尾的角度數或0，可為負數表示反向。
matrix
設定元素的變形矩陣，因為矩陣變形過於複雜，暫略。
origin
設定元素的懸掛點，用法包括：
transform-origin: a b;                元素的懸掛點為(a, b)
元素的懸掛點即為它旋轉和傾斜時的中心點。取值中的a、b可以是長度值、以%結尾的百分比或者left、top、right、bottom四個值。


transition
transition-property
指定transition效果作用的CSS屬性，其值是CSS屬性名。

transition-duration

動畫效果持續的時間，其值為以s結尾的秒數。
transition-timing-function
指定元素狀態的變化速率函式，其取值基於貝賽爾曲線函式，詳情如下所示：


transition-delay
動畫效果推遲開始執行的時間，其值為以s結尾的秒數。