css两张图片怎么叠加

在网页设计中，图片层叠是一种经常使用的效果。这种效果能够让图片之间具有一定的视觉关联性，从而使得网页更加美观。在CSS中，我们可以使用多种方式实现图片层叠效果，其中最常用的方法就是使用绝对定位（absolute positioning）和z-index属性。

具体来说，我们可以创建两个带有背景图片的DIV，然后利用CSS的层叠顺序（stacking order）将它们叠加在一起。下面是一个示例代码：

 <div class="parent">
        <div class="child1"></div>
        <div class="child2"></div>
    </div>
  
    .parent {
        position: relative;
        width: 400px;
        height: 400px;
    }
  
    .child1 {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-image: url('image1.jpg');
        z-index: 1;
    }
  
    .child2 {
        position: absolute;
        top: 50px;
        left: 50px;
        width: 300px;
        height: 300px;
        background-image: url('image2.jpg');
        z-index: 2;
    } 

在这个例子中，我们创建了一个父级DIV，然后在里面创建了两个子级DIV。其中，第一个子级DIV（class="child1"）宽高均为100%且z-index为1，覆盖了整个父级DIV；第二个子级DIV（class="child2"）宽高为300px、居中且z-index为2，覆盖了第一个子级DIV的一部分。因为第二个子级DIV的z-index值大于第一个子级DIV，所以它在层叠顺序中位于第一个子级DIV之上，从而形成了图片的层叠效果。

通过以上的CSS代码，我们可以将两张图片叠加在一起。需要注意的是，由于这两张图片重叠部分的z-index不同，因此在调整z-index时需要将它们进行区分。同时，也需要注意CSS的边界和尺寸问题，以确保图片的位置和尺寸合适适配。