css3中如何让3张图片重叠

CSS3可以让3张图片叠加在一起，创造出视觉上的层次感和丰富的表现形式。下面介绍几种实现方法。

    
    .image-container {
      position: relative;
    }

    .image-container img {
      position: absolute;
      top: 0;
      left: 0;
    }

    .image-container img:nth-child(2) {
      opacity: 0.7;
      z-index: 2;
    }

    .image-container img:nth-child(3) {
      opacity: 0.4;
      z-index: 1;
    }
    

以上代码是使用CSS3实现3张图片叠加的一种方法。首先，通过设置父元素的position属性为relative，让子元素具有相对于父元素的定位。然后，通过设置子元素的position属性为absolute，让它们脱离文档流，可以通过top和left属性控制元素的位置。

接着，通过nth-child伪类选择器，选择第2张和第3张图片，分别设置它们的透明度和z-index属性，使它们成为下面的图片，但不会完全遮挡住上面的图片。

以上方法只是其中一种。还有其他的方式，例如使用伪元素、Box-shadow属性等。