漸變是一種可以將兩種或更多顏色平滑地過渡到一起的技術(shù)。CSS提供了添加漸變動(dòng)畫的功能，可以讓我們的網(wǎng)頁更加生動(dòng)，吸引用戶注意。

/* 添加線性漸變動(dòng)畫 */
.gradient {
background: linear-gradient(to right, red, orange, yellow, green, blue, indigo, violet);
background-size: 1200% 100%;
animation: gradient 20s ease infinite;
}
@keyframes gradient {
0% { background-position: 0 0; }
100% { background-position: 100% 0; }
}

上述代碼中，使用了background屬性來添加線性漸變，to right表示漸變的方向是從左到右。接下來的red、orange等顏色是漸變中要經(jīng)過的顏色。在加上background-size屬性，可以將漸變擴(kuò)大到1200%的寬度，以達(dá)到滾動(dòng)的效果。

最后，使用animation屬性來定義漸變的動(dòng)畫，20s代表漸變的時(shí)長為20秒，ease表示動(dòng)畫執(zhí)行過程中變化的速度先快后慢，infinite表示循環(huán)進(jìn)行。

/* 添加徑向漸變動(dòng)畫 */
.gradient {
background: radial-gradient(circle, #fff, #000);
animation: gradient 20s ease infinite;
}
@keyframes gradient {
0% { background-size: 0 0; }
100% { background-size: 200% 200%; }
}

如果想要添加徑向漸變動(dòng)畫，只需要使用radial-gradient屬性即可。circle表示漸變中心的形狀是圓形，#fff和#000是漸變要經(jīng)過的兩種顏色。

使用animation屬性來控制漸變的速度和循環(huán)次數(shù)，通過background-size屬性來控制漸變的大小。

以上便是CSS添加漸變動(dòng)畫的簡要介紹，可以通過這種方式使網(wǎng)頁更加動(dòng)感和生動(dòng)，吸引更多的用戶。