動畫調用語法
animation: bounceIn 0.3s ease 0.2s 1 both;
按順序解釋參數：
動畫名稱 如：bounceIn
一周期所用時間 如：0.3s
速度曲線 如：ease
動畫開始時間 如： 0.2s
播放次數 如：1 如果要一直循環就設置 infinite
動畫在播放之前或之后，其動畫效果是否可見 如：both
兼容性設置動畫
-webkit-animation:bounceInDown 0.3s ease 0.2s 1 both;
-moz-animation:bounceInDown 0.3s ease 0.2s 1 both;
-ms-animation:bounceInDown 0.3s ease 0.2s 1 both;
-o-animation:bounceInDown 0.3s ease 0.2s 1 both;
animation: bounceInDown 0.3s ease 0.2s 1 both;
本css中的動畫效果
vanishIn 中心縮小的模糊變清楚后顯示
vanishOut 中心放大清楚變模糊后消失
twisterInUp 從右側螺旋轉進來放大
slideUp 向上移動
slideDown 向下移動
puffOut 中心放大清楚變粒子后消失
puffIn 從外向中心縮小出現
twisterInDown 從左側螺旋轉進來放大
rollIn 從左側翻滾進來
lightSpeedIn 從右側光速進入
lightSpeedOut 光速出去
fadeIn 原地淡入·
fadeOut 原地淡出
fadeInLeft 從左側移入，淡入
fadeInRight 從右側移入，淡入
fadeInDown 從上方移入，淡入
fadeInUp 從下方移入，淡入
fadeOutDown 向下移出，淡出
fadeOutLeft 向左移出，淡出
fadeOutRight 向右移出，淡出
fadeOutUp 向上移出，淡出
swing 扭動搖晃
wobble 左右大幅度搖晃
rotateIn 旋轉360度
flip 橫向翻轉
zoomIn 中心放大顯示
zoomOut 向中心縮小消失
bounceIn 從中心擴大彈出顯示
bounceInLeft 從左側彈入
bounceInRight 從右側彈入
bounceInUp 向上彈入
bounceInDown 向下彈入
bounceOut 向中心彈出消失
bounceOutDown 向下彈消失
bounceOutLeft 向左彈消失
bounceOutRight 向右彈消失
bounceOutUp 向上彈消失
rollOut 向右滾出消失
rubberBand 原地彈性彈一下
heartbeat 原地像心跳一樣彈一下
flipOutY y軸翻轉消失
flipInX x軸翻轉顯示
flipInY y軸翻轉顯示
flipOutX x軸翻轉消失
tada 原地抖動
jello 原地斜向抖動
flash 原地閃爍
pulse 原地輕微放大后還原
sharp 模糊到清楚顯現
scaleUp 原地放大
scaleDown 原地縮小
blur 原地變模糊保持模糊狀態
start 閃現一下消失
rightflip 閃現一下向右消失
shake 原地抖動
hinge 剝落
boingInUp 向前蕩入
holeOut 縮小翻轉收走
最后附： 下載連接
