我想知道是否有一种简单的方法来找到CSS过滤器或SVG过滤器,这与将div和背景和不透明度应用于图像上的效果相同。

我需要一个可以应用于第一张图片的滤镜,使其看起来像第二张图片

.img {
  filter: ...
}


https://jsfiddle.net/1qd6pyfu/

最佳答案

这看起来非常接近基本的乘法混合-就像这样(我不太喜欢绿色)。您也可以使用CSS混合模式来做到这一点。

<svg width="800px" height="600px">
  <defs>
  <filter id="greenit" x="0%" y="0%" width="100%" height="100%">
   <feFlood flood-color="#8B5"/>
   <feBlend mode="multiply" in2="SourceGraphic"/>
  </filter>

  </defs>

  <image filter="url(#greenit") width="400px" height="400px" xlink:href="https://www.binarymoon.co.uk/wp-content/uploads/2012/04/draw-something-unicorn-e1334932907258.png"/>

</svg>

关于css - SVG或CSS过滤器,等于不透明的上层div,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/40632537/

10-12 12:25
查看更多