CSS自定義動畫是一種能夠讓網(wǎng)頁元素動態(tài)變化的技術(shù)，可以通過定義關(guān)鍵幀和屬性來實(shí)現(xiàn)多種動畫效果。

/* 定義動畫名稱、持續(xù)時間和關(guān)鍵幀 */
@keyframes my-animation {
from {
opacity: 0;
transform: translateX(-100%);
}
to {
opacity: 1;
transform: translateX(0);
}
}
/* 給元素應(yīng)用動畫 */
.element {
animation-name: my-animation;
animation-duration: 2s;
}

上述代碼定義了一個名為“my-animation”的動畫，持續(xù)時間為2秒，關(guān)鍵幀為“from”和“to”。從“from”到“to”的過程中，元素的透明度從0變?yōu)?，同時沿X軸從左側(cè)進(jìn)入視圖。

通過給元素添加“animation-name”和“animation-duration”的CSS屬性，就可以應(yīng)用定義好的動畫效果。還可以使用“animation-delay”和“animation-iteration-count”等屬性調(diào)整動畫的延遲和重復(fù)次數(shù)。

/* 調(diào)整動畫延遲和重復(fù)次數(shù) */
.element {
animation-delay: 1s;
animation-iteration-count: infinite;
}

在實(shí)際應(yīng)用中，可以用CSS自定義動畫來實(shí)現(xiàn)各種效果，如平滑的過渡、漸隱漸現(xiàn)、按需加載等。與JavaScript相比，CSS自定義動畫更輕量級、性能更好，并且可以使用硬件加速等優(yōu)化技術(shù)來提升動畫效果。