CSS可以通過改變顏色實現動畫效果，下面我們來看一下如何實現。

/* 先定義一個class */
.color-change {
background-color: red;
transition: background-color 1s ease-in-out;
}
/* 然后在JS中觸發class的切換即可 */
document.querySelector('button').addEventListener('click', function() {
document.querySelector('p').classList.toggle('color-change');
});

上面的代碼中，我們定義了一個class名為color-change，它的background-color為紅色，并設置了一個時長為1s、速度為ease-in-out的過渡效果。

接著，在JS中監聽一個按鈕的點擊事件，每次點擊時切換p標簽的class為color-change，就可以看到p標簽的背景色漸變為紅色。

如果想要實現更多樣化的變化效果，可以調整過渡效果的時長、速度和屬性值，比如改變字體顏色、邊框顏色等等。