一般情况下，我们直接使用background设置元素渐变属性，但是还可以使用background-image和渐变属性控制元素渐变。下面利用实例说明如何使用背景图片渐变控制元素渐变，操作如下：
工具/原料
1
HTML5
2
CSS3
3
HBuilder
4
浏览器
5
截图工具
方法/步骤
1
第一步，在已新建的Web项目中创建HTML5页面，并在
插入语一个div标签，如下图所示：2
第二步，由于div标签设置了class属性，使用这个属性选择器设置div标签的样式，如下图所示：
3
第三步，使用HBuilder中自带的浏览器预览工具图标，查看页面效果，如下图所示：
4
第四步，再使用类选择器，设置background-image属性linear-gradient，如下图所示：
5
第五步，刷新浏览器，可以看到div标签显示的页面出现颜色渐变，如下图所示：
6
第六步，最后给div添加border-radius属性，修改字体大小属性，然后再次查看效果，如下图所示：
注意事项
1
注意如何使用background-image设置背景渐变
2
注意linear-gradient属性控制线性渐变
上一篇：带狗狗去海边之必备行装
下一篇：PS如何给图片添加渐变颜色