代码
.rainbow-linear-gradient {
width: 460px;
height: 160px;
background-image: linear-gradient(to right, #E50743 0%, #F9870F 15%, #E8ED30 30%, #3FA62E 45%, #3BB4D7 60%, #2F4D9E 75%, #71378A 80%);
}
上述代码中: 第10行代码中每个颜色值后面的百分数表示该色标的位置比例。
运行效果
渐变是两种或多种颜色之间的平滑过渡,渐变背景一直以来在Web页面中都是一种常见的视觉元素。CSS3的渐变属性主要包括线性渐变、径向渐变和重复渐变。CSS3中的线性渐变一般通过“ background-image: linear-gradient(参数值) ” 来实现。 (注:在CSS3以前,必须使用图像来实现这些效果)
推荐链接
评论可见,请评论后查看内容,谢谢!!!
发表评论