CSS動畫是一種非常酷炫的網頁設計元素，但是有時動畫結束后網頁上的元素會回到初始狀態。如果希望元素保持在動畫結束時的狀態，我們需要使用CSS的“animation-fill-mode”屬性。

“animation-fill-mode”屬性指定了動畫狀態在播放前和播放后是否應用到元素。默認值為“none”，這意味著如果沒有指定該屬性，動畫播放結束后，元素將返回到初始狀態。

.anim {
animation-name: myanimation;
animation-duration: 3s;
animation-fill-mode: both;
}
@keyframes myanimation {
from {
transform: scale(0.5);
opacity: 0.1;
} to {
transform: scale(1.0);
opacity: 1;
}
}

上面的代碼將創建一個名為“myanimation”的動畫，它將元素從50%的縮放和10%的不透明度過渡到100%的縮放和100%的不透明度。動畫將持續3秒，并將“animation-fill-mode”設置為“both”。

設置“animation-fill-mode”為“both”將導致元素在動畫開始之前和動畫結束之后保留最終狀態。這意味著在上面的代碼中，元素將保持在100%的大小和100%的不透明度，即使動畫已經結束。

在動畫結束后保持元素狀態非常有用，可以讓我們創建更流暢，更自然的交互效果。無論是在按鈕懸停，鼠標點擊或頁面加載時，保持動畫狀態都可以為用戶提供更好的體驗。