如何在CSS / Wordpress中将一个图像放在另一个图像上？

Question

先发制人，谢谢您的帮助！

我是一名初学程序员，我正试图在wordpress中将一个照片链接放在另一个上。

以下是link

你可以在上面的链接中看到我想将底部图像放在顶部图像上，并保持它们都是响应式的，但是我遇到了css属性的问题来实现这个目的..？

有什么想法吗？

非常感谢你，

-C

Answer 1

将两个图像包裹在div中并将位置设置为相对位置。

<div style="position:relative;">
 <img src="#" style="left:0px; top:0px;"/>
 <img src="#" style="left:0px; top:0px;"/>
</div>

更新1

抱歉，第一个回答无效。我发现图像是垂直完美对齐的。标题图像与窗口顶部对齐。 您唯一需要做的就是：

.second-image-home
{
  position:absolute;
  top:0px;
}

这对我有用。

如果删除

height:auto;

图像尺寸正确。

更新2

如果我将此添加到css：

.second-image-home
{
  height: 193px;
  width: 309px;
  //rest of the code
}

发生了这种情况：

Answer 2

我会很友好的一个css是

.yourclass {
     z-index: 1;
     position: absolute;
}

z-index将允许您将一个图像放在另一个图像上，只要您有一个位置，您就可以在一个位置堆叠任意数量的图像。使用顶部，左侧，右侧，底部来定位您想要的位置。

希望这有帮助！