CSS動畫屬性是CSS3的一項(xiàng)新特性，它可以通過CSS樣式來實(shí)現(xiàn)動態(tài)的特效。CSS動畫屬性包括animation和transition兩種，下面我們將重點(diǎn)介紹animation屬性。

.animation {
animation-name: my-animation; /*動畫名稱*/
animation-duration: 3s; /*動畫持續(xù)時間*/
animation-timing-function: ease; /*動畫變化速率*/
animation-delay: 1s; /*動畫延遲時間*/
animation-iteration-count: infinite; /*動畫循環(huán)次數(shù)*/
animation-direction: alternate; /*動畫播放方向*/
animation-fill-mode: forwards; /*動畫結(jié)束后的狀態(tài)*/
animation-play-state: running; /*動畫播放狀態(tài)*/
}

以上是animation屬性的基本寫法，下面詳細(xì)解釋各個屬性的用法：

animation-name：指定動畫的名稱，可以定義多個動畫名稱，用逗號隔開。

animation-duration：指定動畫持續(xù)時間，單位為秒或毫秒。

animation-timing-function：指定動畫變化速率，常用的值有ease、linear、ease-in、ease-out、ease-in-out。

animation-delay：指定動畫延遲時間，單位為秒或毫秒。

animation-iteration-count：指定動畫循環(huán)次數(shù)，可以為具體數(shù)字，也可以為infinite。

animation-direction：指定動畫播放方向，常用的值有normal、reverse、alternate、alternate-reverse。

animation-fill-mode：指定動畫播放結(jié)束后的狀態(tài)，取值有none、forwards、backwards、both。

animation-play-state：指定動畫的播放狀態(tài)，可選值為running和paused。

通過animation屬性，我們可以輕松實(shí)現(xiàn)各種炫酷的動畫效果，如旋轉(zhuǎn)、縮放、淡入淡出等。