css 动画

当涉及到CSS动画时，有几种方式可以实现动画效果。以下是一些常见的CSS动画技术：

1. 使用@keyframes规则：@keyframes规则允许你创建一个动画序列，定义动画的关键帧和属性值。例如，你可以创建一个旋转动画，让一个元素在页面上旋转。

   @keyframes rotate {from {transform: rotate(0deg);}to {transform: rotate(360deg);}
   }.element {animation: rotate 2s infinite;
   }
   

 2.使用transition属性：transition属性允许你在元素状态改变时平滑地过渡属性的值。例如，你可以让一个按钮在鼠标悬停时改变背景颜色，并且有一个平滑的过渡效果。

.button {background-color: #3498db;transition: background-color 0.3s ease;
}.button:hover {background-color: #2980b9;
}