css一张图片盖着另一张图片

有时候我们需要将一张图片盖在另一张图片上面，类似于遮罩效果。这种效果可以使用 CSS 来实现。

首先，我们需要将两张图片放在同一个容器中：

<div class="image-container">
  <img src="img1.jpg" alt="Image 1">
  <img src="img2.jpg" alt="Image 2">
</div> 

接着，我们可以使用 CSS 来控制第二张图片的位置和透明度：

.image-container {
  position: relative;
}

.image-container img:last-child {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0.5;
} 

这里我们使用了相对定位的容器来作为参照物，然后使用绝对定位来将第二张图片放置在容器的左上角。而透明度则被设置为 0.5，以实现遮罩效果。

需要注意的是，两张图片的尺寸应该相同或者第二张图片的尺寸应该大于第一张图片，否则效果可能会不理想。

完成后的效果如下：