在CSS中，幀(Frame)是所謂CSS動畫的基本概念之一。它是一個動畫序列的獨立靜態圖像，可以是普通圖片、精靈圖或SVG等。每個CSS幀都表示動畫序列中的一個時間點，通過多個幀的組合，可以實現各種復雜的動畫效果。

<style>
@keyframes my-animation{
0%{background-color: red;}
50%{background-color: blue;}
100%{background-color: green;}
}
.my-element{
animation-name: my-animation;
animation-duration: 3s;
animation-timing-function: ease-in-out;
animation-delay: 1s;
animation-iteration-count: infinite;
}
</style>
<div class="my-element">這是一個動畫效果</div>

    上述代碼中，定義了一個名為“my-animation”的關鍵幀，它的起始狀態是紅色背景，中間狀態是藍色背景，結束狀態是綠色背景。通過“animation-name”屬性將此幀序列應用到一個class為“my-element”的HTML元素上，同時指定動畫時長、時間函數、延遲時間和循環次數等動畫細節。

    CSS幀不僅可以設置背景顏色，還可以設置位置、大小、旋轉、透明度等屬性，甚至可以通過@keyframes新語法指定更復雜的動畫效果。在實踐中，我們可以通過CSS幀輕松地實現補間動畫、逐幀動畫、過渡動畫等多種類型的可視化效果。因此，熟練掌握CSS幀的使用是成為優秀的Web前端工程師必不可少的技能之一。