如何用css实现两个图片的重叠

您可以使用`position`属性和`z-index`属性来实现两个图片的重叠效果。以下是一个简单的示例代码：

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

.image-container {
  position: relative;
}

.image1 {
  position: relative;
  z-index: 1;
}

.image2 {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
}

在这个例子中，我们首先创建了一个包含两个图片的容器`.image-container`。我们将其`position`属性设置为`relative`，以使其成为一个相对定位的容器。

接着，我们给第一个图片`.image1`设置了`position`属性为`relative`，以使其相对于父容器`.image-container`进行定位。我们还将其`z-index`属性设置为1，以使其在第二个图片之下。

然后，我们给第二个图片`.image2`设置了`position`属性为`absolute`，以使其相对于父容器`.image-container`进行绝对定位。我们将其`top`和`left`属性设置为0，以使其覆盖在第一个图片之上。最后，我们将其`z-index`属性设置为2，以使其在第一个图片之上。

通过这样的方式，第二个图片就会覆盖在第一个图片之上，从而实现了两个图片的重叠效果。您可以进一步自定义样式属性来调整它们的位置和大小，以达到您想要的效果。