CSS3是一種常用的網頁設計語言，它可以通過添加網頁動畫來增加網頁的視覺效果。CSS3支持各種類型的動畫和特效，從簡單的過渡到復雜的交互式效果，滿足了不同網頁設計需求，提高了用戶體驗。接下來我們來學習CSS3的網頁動畫。

/* 設置動畫的類名 */
.example {
/* 動畫的名稱 */
animation-name: example;
/* 動畫的時間 */
animation-duration: 2s;
/* 動畫的重復次數 */
animation-iteration-count: infinite;
/* 動畫的方向 */
animation-direction: alternate;
}
/* 設置關鍵幀 */
@keyframes example {
/* 開始狀態 */
0% {transform: rotate(0deg);}
/* 中間狀態 */
50% {transform: rotate(180deg);}
/* 結束狀態 */
100% {transform: rotate(360deg);}
}

上述CSS3代碼演示了一個無限旋轉的網頁動畫，類名“example”是一個標識符，通過元素的class屬性來使用它。animation-name屬性定義了使用的動畫的名稱，它必須與@keyframes定義的名稱相同。animation-duration屬性定義了動畫持續的時間，以秒為單位。animation-iteration-count屬性定義了動畫的重復次數，通過設置infinite來實現無限次重復。animation-direction屬性指定了動畫運行的方向，可選值為normal、reverse、alternate或alternate-reverse。

@keyframes定義了動畫的關鍵幀，即在動畫運行過程中的每一步的狀態。起始狀態0%和結束狀態100%是必須的，中間狀態可以自定義，例如上面代碼中的50%狀態。transform: rotate(xdeg)表示對元素進行x度的旋轉。

CSS3還支持其他類型的動畫和特效，例如透明度、尺寸、陰影、邊框等。CSS3的動畫功能使得網頁設計更加靈活和多樣化，通過它實現的效果令人驚艷，為用戶帶來更好的訪問體驗。