Question

如何让图像与另一张图像重叠，我可以让文字重叠我的背景图像，但我想在该图像上面放一系列图像。

Answer 1

简单地使用z-index，数字越大，堆叠中的堆叠越高（即 - 更靠近观察者）：

＆＃13;

img {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
}
.image1 {
  z-index: 9999;
  width: 100px;
  height: 100px;
}
.image2 {
  z-index: 999;
  width: 200px;
  height: 200px;
}
.image3 {
  z-index: 99;
  width: 300px;
  height: 300px;
}
.image4 {
  width: 400px;
  height: 400px;
}

＆＃13;

<img class="image1" src="http://gallery.photo.net/photo/6182716-md.jpg">
<img class="image2" src="http://gallery.photo.net/photo/12682192-md.jpg">
<img class="image3" src="http://gallery.photo.net/photo/2568318-md.jpg">
<img class="image4" src="http://gallery.photo.net/photo/6506352-lg.jpg">

＆＃13;

Answer 2

好吧，如果您只想在背景图片上方放置图片，那么只需将图片放在您拥有的内容中即可。如果要图像在图像上，请使用z-index

为每张图片应用z-index，最高编号为＆＃34;最高＆＃34;图片。

Z-index: 1;
Z-index: 2;
Z-index: 3;

Etc等。

Answer 3

img {
    position: absolute;
    left: 0px;
    top: 0px;
    z-index: -1;
}

z-index的值越高越好。

在html中，如何将图像与其他图像重叠？

3 个答案: