CSS是一種樣式語言，可以為網頁添加各種效果，例如樣式、布局和動畫等等。本文將介紹如何使用CSS來添加動畫效果。

在CSS中，動畫是通過@keyframes規則來定義的。@keyframes規則包含要進行動畫的關鍵幀和動畫效果，可以在任何樣式表中使用。

@keyframes example {
0% {background-color: red;}
50% {background-color: yellow;}
100% {background-color: green;}
}

在上面的例子中，定義了一個名為example的關鍵幀。該規則在0%、50%和100%的位置設置了不同的背景顏色，我們可以使用以下CSS代碼將其應用于HTML元素：

div {
width: 100px;
height: 100px;
background-color: red;
animation-name: example;
animation-duration: 4s;
}

上面的代碼可以將上面定義的example動畫應用于一個div元素，并設置它的持續時間為4秒。

除了animation-name和animation-duration屬性之外，CSS還提供了其他的動畫屬性，例如animation-delay、animation-iteration-count和animation-timing-function等等。這些屬性可以設置動畫的延遲時間、循環次數和時間函數等等。

總之，通過使用@keyframes規則和相關的動畫屬性，我們可以輕松地為HTML元素添加各種動畫效果。