CSS 动画，可以使用 @keyframes 规则，它定义了一个名称以及包含动画序列的关键帧集合。然后将此动画序列应用于元素上，例如通过在样式表中使用 animation 属性。
下面是一个简单的例子，用于使 div 元素从左侧向右移动：
/* 定义关键帧 */
@keyframes move {
from {left: 0;}
to {left: 100px;}
}
/* 将动画应用到元素 */
div {
animation-name: move;
animation-duration: 1s;
}在上面的示例中, 我们将动画命名为 move，并定义了两个关键帧：起始状态 from 和最终状态 to，其中 from 使该元素位于页面的最左侧，而 to 将其推到右边。接下来，我们通过在 div 元素上使用 animation-name 属性指定要使用的动画名称，以及 animation-duration 属性指定动画完成所需的时间长度。
重要关键词：@keyframes、animation、from、to、animation-name、animation-duration。