css 两个img重叠

CSS是前端开发中不可避免的技术，其中涉及的知识点很多，今天我们来讲一下两个img重叠的情况下该如何处理。

在开发过程中，我们有时会需要在页面中让两张图片重叠显示，一般的做法是使用定位的方法来实现。下面是一个示例代码：

    div class="container">
            img src="img1.jpg" alt="" class="img1">
            img src="img2.jpg" alt="" class="img2">
        /div>
    .container {
            position: relative;
    }
    .img1 {
            position: absolute;
            left: 0;
            top: 0;
    }
    .img2 {
            position: absolute;
            left: 0;
            top: 0;
            z-index: 1;
    }
    

在上面的代码中，我们将图片放置在一个容器中，并设置了两张图片的定位方式为absolute。为了达到重叠效果，我们需要设置其中一张图片的z-index值高于另一张图片，这里我们设置了img2的z-index为1，而img1的z-index默认为0。

这样，我们就实现了两张图片的重叠。当然，具体的具体实现方式会因开发需求而有所不同，上面的代码只是供参考。

声明：本文内容由网友自发贡献，本站不承担相应法律责任。对本内容有异议或投诉，请联系2913721942#qq.com核实处理，我们将尽快回复您，谢谢合作！