<p>两张图片的父元素颜色都是粉色的。第一张图片<code>mix-blend-mode:multiply</code>,第二张图片<code>mix-blend-mode:normal</code></p>
<div class="demo1">
  <img src="https://source.unsplash.com/s87ngBxo4xg/500x500" alt="Red flowers on branches" />
</div>
<div class="demo2">
  <img src="https://source.unsplash.com/s87ngBxo4xg/500x500" alt="Red flowers on branches" />
</div>
.demo1,
.demo2 {
  max-width: 200px;
  background-color: pink;
  margin: 10px 0;
}
img {
  width: 100%;
}

.demo1 > img {
  mix-blend-mode: multiply;
}

.demo2 > img {
  mix-blend-mode: normal;
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.