CSS3 Transition 和Animation區別及比較

這種效果可以在鼠標單擊、點擊、獲得焦點、或對元素任何改變中觸發，並以動畫效果改變CSS屬性值。


二、animation @keyframes規則，用於創建動畫，@keyframes規定某項CSS樣式，創建由當前樣式逐漸改為新樣式的動畫。 注意事項：創建時需綁定選擇器，否則無效果。
三、區別
transition： 強調過渡； 需要觸發一個事件，比如鼠標移上去、焦點、點擊。
animation：多個關鍵幀，實現自由動畫； 不需要觸發任何事件也可隨時間變化達到一種動畫效果； 與transition不同是animation可以通過@keyframe控制當前幀屬性，更靈活。