这里是通过 background-blend-mode 混合方式&背景叠加的方式在当前图片上叠加一层颜色。
要注意的是图片的背景颜色只能为白色，图片颜色黑色最佳

代码如下

其中linear-gradient(#f00, #f00);是background的第二个属性，用逗号分隔开
如果要实现线性渐变，把两个颜色分别设置为初始和结束颜色。只想用纯色背景就设置成一样的颜色

background-blend-mode: lighten;注意，属性是lighten 变亮的意思，因为推荐使用的图片颜色是黑色，黑色没有亮度，对变色的影响较小，使用其他颜色背景的图片要注意颜色的混合。

暂时没有找到解决方案的一个小问题：图片的大小要控制好，和父元素的宽高要一致，否则叠加的背景会在图片周围产生边框。