在制作動畫時，可能會遇到這樣的問題：當動畫結束后，元素就立刻回到了初始狀態，這看起來很生硬，而我們期望元素能夠保持動畫的狀態。這時，我們就需要使用動畫保持。

在 HTML 中，我們使用 CSS 來設置動畫。在設置動畫樣式時，我們可以使用animation-fill-mode屬性來控制動畫的保持狀態。該屬性一共有四個值：

animation-fill-mode: none; // 默認值， 動畫完成后元素回到初始狀態
animation-fill-mode: forwards; // 動畫完成后元素保持最后一幀狀態
animation-fill-mode: backwards; // 動畫延遲前元素處于初始狀態，在動畫開始時應用第一幀樣式
animation-fill-mode: both; // 元素將保留動畫開始和結束時的狀態。

舉個例子，在下面的CSS中，我們創建了一個2秒的從白色到深藍色的背景色動畫。在結束后，我們希望背景色一直保持在最后一幀的深藍色。

.box {
animation: color-change 2s;
animation-fill-mode: forwards;
}
@keyframes color-change {
0% { background-color: white; }
100% { background-color: #0072C6; }
}

這樣，我們就完成了動畫保持的設置。