css同时设置渐变色背景和背景图的方法

需求说明

模块设置了一个带有从左到右渐变色的背景图，在大屏幕下，需要这个模块背景自然，没有明显背景图和背景分界线

所以需要给模块添加一个从左到右的渐变背景色

实现方法

background: url('背景图片.png'), linear-gradient(to right, #颜色1, #颜色2);

可以设置图片位置，例如水平居中，垂直上对齐，图片不重复，如下：

background: url('背景图片.png') center top no-repeat, linear-gradient(to right, #颜色1, #颜色2);

根据实际需求进行背景图片和渐变背景色设置~
to right ~ 从左到右渐变
可以设置多个渐变颜色值
可以设置不同渐变方向
可以设置渐变位置
等等

注意：背景图片要放在背景色之前写，否则显示不出来背景图片

代码示例：

background: url('背景图片.png') center top no-repeat, linear-gradient(to right, #fff 0%,#7baad0 30%, #dedbd4 70%, #fff 100%);

效果：