CSS图像颜色覆盖在Kisscut图像png

时间:2018-07-01 17:45:03

标签: html css css3 css-filters

嗨,我正在尝试对吻切透明png的图像进行颜色叠加,有点像具有不透明度控制的photoshop颜色叠加。

我尝试搜索,但找不到此特定解决方案。 https://jsfiddle.net/j2e83gxq/9/

.imgoverlay {
  width:500px;
  padding-top:500px;
  background-image:url("https://upload.wikimedia.org/wikipedia/commons/6/66/Android_robot.png");
  background-repeat:no-repeat;
  background-size:contain;
  background-color:cyan;
  background-blend-mode: overlay;
}
<div class="imgoverlay">
</div>

我所能找到的只是使用背景色,但这为整个Element着色,我只需要它覆盖图像,而不是覆盖其透明面。

因此,基本上我正在尝试对该图像进行颜色叠加: https://upload.wikimedia.org/wikipedia/commons/6/66/Android_robot.png

具有不同的颜色。

1 个答案:

答案 0 :(得分:0)

您无法在CSS中实现此效果,最好的方法是使用Photoshop。