你们好，最近小活发现有诸多的小伙伴们对于html渐变背景色，html渐变色代码这个问题都颇为感兴趣的，今天小活为大家梳理了下，一起往下看看吧。
1、打开html开发工具，新建一个html代码页面
2、在html代码页面上创建<div>，同时给这个<div>创建一个class类为linear，用于设置线性渐变背景样式。
3、创建div代码：<div class="linear">线性渐变</div>
4、设置线性渐变。使用linear-gradient对linear类设置背景渐变样式，为了兼容其他浏览器需要对linear-gradient添加兼容浏览器的前缀。
5、css代码：
6、.linear{
7、 width: 500px;
8、 height: 100px;
9、 font-size: 20px;
10、 color: #fff;
11、 text-align: center;
12、 background: -webkit-linear-gradient(left,red, green, blue); /* Safari 5.1 - 6.0 */
13、 background: -o-linear-gradient(left,red, green, blue); /* Opera 11.1 - 12.0 */
14、 background: -moz-linear-gradient(left,red, green, blue); /* Firefox 3.6 - 15 */
15、 background: linear-gradient(left,red, green, blue); /* 标准的语法 */
16、 }
17、保存html代码，使用浏览器打开即可看到线性渐变效果。
以上就是html渐变色代码这篇文章的一些介绍，希望对大家有所帮助。
标签：
免责声明：本文由用户上传，如有侵权请联系删除！