python渐变色背景生成动态代码_css3使用animation属性实现背景颜色动态渐变的效果（附代码）...

网站中的背景颜色如果比较单一会显得不够美观，那么，如何让背景颜色多变呢？本篇文章就来给大家介绍使用CSS3动画让我们背景颜色逐渐改变颜色，调整颜色和顺序的组合，使颜色的设计更加醒目。

话不多说，让我们来看具体内容(推荐课程：css3视频教程)

首先我们来看一下CSS3关键帧动画的基础知识

让我们先了解逐渐改变元素的动画！在CSS 3 animation属性中，您可以设置关键帧并绘制详细的运动。关于动画的时间和时机、无限的循环，只有CSS就可以指定了！

什么是关键帧？

关键帧(传递点)是在动画中定义更改的帧。我们@keyframes定义元素如何随每个关键帧而变化。为了使动画与其关键帧匹配，您需要将@keyframes规则的名称与为元素指定的animation-name属性的名称相匹配。

@keyframes规则的名称声明为“ @keyframes +任意名称 ”。我将写入0％到100％的关键帧信息。0％表示开始动画，100％表示结束时间。0％from，100％可以用to替换。下面的示例是将背景颜色从红色更改为橙色到粉红色的关键框架。@keyframes name {

0% { background: red; }

50% { background: orange; }

100% { background: pink; }

}

说明：对于Chrome和Safari等WebKit浏览器，需要供应商前缀(-webkit-)。以编写方式编写“ -webkit-keyframes ” ，并在@和关键帧之间编写-we