css3背景色自动变换 |css button库

background-color: #00FF00;
animation-name: bgChange;
animation-duration: 5s;
animation-iteration-count: infinite;
@keyframes bgChange{
0% { background-color: #00FF00; }
25% { background-color: #0000FF; }
50% { background-color: #FF0000; }
75% { background-color: #FFFF00; }
100% { background-color: #00FF00; }
}

上面的代码使用了CSS3的动画（animation）属性来实现自动变换背景色的效果。首先，设置了初始的背景色为绿色（#00FF00），然后设置了动画的名称为bgChange，动画时长为5秒，循环次数为无限次。

接下来是关键部分，使用@keyframes关键字定义了一个名为bgChange的动画序列，该序列从0%的进度开始，背景色为绿色；到25%的进度，背景色变为蓝色；到50%的进度，背景色变为红色；到75%的进度，背景色变为黄色；最后到100%的进度，背景色又变成了绿色。

这样就完成了背景色自动变换的效果，让页面更加动态有趣。