CSS中的乘法模式?

CSS中的乘法模式?,css,background-blend-mode,mix-blend-mode,Css,Background Blend Mode,Mix Blend Mode,在Photoshop中,如果您将带有白色背景的JPG图像导入带有蓝色背景的文档中,您可以通过将图像设置为“倍增”模式使图像的白色背景消失 我可以单独使用CSS做同样的事情吗?在CSS中,您可以使用 mix-blend-modeCSS属性描述元素内容的方式 应与它下面的元素内容和 元素的背景 一小条 正文{ 保证金:0; 背景:url(http://lorempixel.com/1200/1200)无重复0 0/盖 } img{ 混合模式:倍增; } 您可以使用but 根据CSS技巧文章,代码如

在Photoshop中,如果您将带有白色背景的JPG图像导入带有蓝色背景的文档中,您可以通过将图像设置为“倍增”模式使图像的白色背景消失

我可以单独使用CSS做同样的事情吗?

在CSS中,您可以使用

mix-blend-mode
CSS属性描述元素内容的方式 应与它下面的元素内容和 元素的背景

一小条
正文{
保证金:0;
背景:url(http://lorempixel.com/1200/1200)无重复0 0/盖
}
img{
混合模式:倍增;
}
您可以使用but

根据CSS技巧文章,代码如下所示:

.blended {
    background-image: url(face.jpg);
    background-color: red;
    background-blend-mode: multiply;
}
是的……有点

这个问题有点模糊,但我们能否删除图像的白色“部分”,让我们看到其背后元素的背景色

是的,我们可以…使用
混合模式

正文{
背景:蓝色;
文本对齐:居中;
}
div{
混合模式:倍增;
显示:内联块;
保证金:1em自动;
}