CSS 动画是一种基于 CSS 样式的动画，可以通过 CSS 中的动画属性来控制动画的速度和方向。大家可以使用 CSS 动画来创建旋转、缩放、平移、移出等效果。
首先，大家需要在 HTML 中添加一个动画盒子，用来展示大家的动画效果。大家可以使用 `<div>` 标签来创建一个动画盒子，并在盒子内部添加大家需要的动画效果。
“`html
<div class=”动画盒子”>
<div class=”动画内容”>
<!– 动画内容 –>
</div>
</div>
接下来，大家需要设置 CSS 样式来控制动画效果。大家可以使用 CSS 的 `@keyframes` 规则来定义动画的keyframes，并在keyframes 中添加动画效果。
“`css
.动画盒子 {
width: 200px;
height: 200px;
border: 1px solid #ccc;
margin: 0 auto;
.动画内容 {
width: 80px;
height: 80px;
background-color: #fff;
animation: rotate 1s linear infinite;
@keyframes rotate {
0% {
transform: rotate(0deg);
100% {
transform: rotate(360deg);
在这个例子中，大家定义了一个名为 `rotate` 的 keyframe，用于控制旋转效果。根据 keyframe 的规则，当 `transform` 属性的值由 `rotate(0deg)` 变为 `rotate(360deg)` 时，动画就会开始。
通过使用 CSS 动画，大家可以轻松地创建出复杂的 2D 动画效果。大家可以将多个 `<div>` 标签添加到动画盒子中，并使用 CSS 动画来控制它们的速度、方向和旋转角度，从而实现各种不同的动画效果。