CSS3動畫是要通過一些定義才能實現的，下面就來介紹一下常用的定義方式。

/* 定義簡單動畫 */
@keyframes animation-name {
0% {
/* 元素狀態 */
}
100% {
/* 元素狀態 */
}
}
/* 定義復雜動畫 */
@keyframes animation-name {
from {
/* 元素狀態 */
}
to {
/* 元素狀態 */
}
}
/* 定義動畫屬性 */
.animated-element {
animation: animation-name 1s ease-in-out infinite alternate;
}

上面的代碼中，使用了@keyframes來定義動畫的關鍵幀，0%表示開始時的狀態，100%表示結束時的狀態，也可以使用from和to等同的關鍵字來定義。動畫屬性的定義使用了animation，其中animation-name為要使用的動畫名稱，1s為動畫持續時間，ease-in-out為動畫速度曲線，infinite表示動畫無限循環，alternate表示動畫在循環時交替反向播放。