CSS3是指在CSS2的基礎上增加了動畫、變形等功能的升級版，讓Web頁面的效果更加豐富，提升用戶體驗。其中，設置動畫結束時的效果就是CSS3的一項重要功能。如何實現動畫結束時的效果呢？

/*設置動畫*/
.animation{
animation-name: my-animation; /*動畫名稱*/
animation-duration: 2s; /*動畫持續時間*/
animation-fill-mode: forwards; /*動畫結束時的效果*/
}
/*定義動畫*/
@keyframes my-animation{
from{opacity:0;} /*起始狀態*/
to{opacity:1;} /*結束狀態*/
}

上述代碼實現了一個簡單的淡入動畫效果，并設置了動畫結束時的效果為保持最后一幀狀態。這里采用了animation-fill-mode屬性，其有以下幾個可選值：

• none：默認值，表示動畫結束時不做任何處理。
• forwards：表示動畫結束時保持最后一幀的狀態。
• backwards：表示動畫開始前，先讓元素以動畫第一幀的狀態顯示。
• both：表示同時應用forwards和backwards效果。

這里需要注意的是，如果同時使用了animation-fill-mode屬性和animation-play-state屬性，其優先級是animation-play-state更高。

總之，設置動畫結束時的效果可以讓你的頁面更加生動、有趣！