html - 我们如何使用 css 样式重叠两个图像？

Question

我在 html 表格中有一个图像列表，需要在每个图像上重叠一个小图标。我们如何使用 z 索引和定位来做到这一点？

Answer 1

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

.over {
  position: absolute;
  left: 40px;
  top: 10px;
  z-index: -1;
}

<img src="https://tafttest.com/184x46.png" width="184" height="46" class="under" />
<img src="https://tafttest.com/100x84.png" width="100" height="84" class="over" />