使用 CSS 制作动画效果可以通过 @keyframes 规则实现。该规则定义动画中的关键帧，并指定不同时间点元素应具有的样式属性。然后可以使用 animation 属性将这些关键帧应用于特定元素。
以下是一些可能用到的关键词和示例示意：
@keyframes move-right {
from {
left: 0;
}
to {
left: 100%;
}
}#my-element {
animation-name: move-right;
animation-duration: 2s;
animation-fill-mode: forwards; /* 动画结束时保留最后一帧状态 */
}#my-element {
animation-timing-function: ease-in-out;
}#my-element {
animation-iteration-count: 3;
}通过组合这些属性以及其他 CSS 属性，我们可以创建各种动画效果。但是请注意避免过度使用动画，因为它们可能会耗费设备资源并影响用户体验。