css代码实现控制图片颜色或者改变图片颜色

1、黑色纯色，背景白色的图片

.pic1 {
    background-image: url($img), linear-gradient(#f00, #f00); //纯色渐变
    background-blend-mode: lighten;
    background-size: cover; //图片铺满屏幕
}
.pic3 {
    background-image: url($img), linear-gradient(#f00, #00f); //渐变色渐变
    background-blend-mode: lighten;
    background-size: cover; 
}

lighten这个混合模式：变亮、变亮模式与变暗模式产生的效果相反，黑色比任何颜色都要暗，所以黑色会被任何色替换掉。反之，如果素材的底色是黑色，主色是白色。那就应该用变暗（darken）的混合模式