CSS进阶知识：动画（animation），动画的定义，动画的基本使用，动画序列的介绍，简单的案例（正方形从左边到右边），from...to的使用，多段动画制作基础案例
在CSS中，我们可以使用@keyframes规则来定义一个动画序列（animation sequence），然后通过animation属性来应用这个动画序列到一个选择器上。
以下是一个简单的例子，展示了如何定义和使用一个动画：
/* 定义一个名为 'fadeInOut' 的动画 */
@keyframes fadeInOut {
0%, 100% { opacity: 0; }
50% { opacity: 1; }
}
/* 应用动画到一个元素上 */
.element {
animation: fadeInOut 2s infinite;
}在这个例子中，.element 类将会应用一个名为 fadeInOut 的动画，这个动画会在2秒内完成，并且是无限循环的。动画的效果是改变元素的透明度，从0到1再到0，实现淡入淡出的效果。
评论已关闭