html - 两个图像相对的 Z-index

Question

我有一个小问题，我似乎无法弄清楚。我试着搜索这个问题，但我似乎找不到可靠的答案。

看这个例子: Fiddler

这很简单。我有一个位于屏幕中央的 div。这个 div 包含一个图像，我想根据 XY 位置将另一个图像放在顶部。(通常我从数据库中获取这些 XY 位置，但为了本示例的清晰起见，我对它们进行了硬编码)。

当我运行代码时，我的图像位于我的第一张图像旁边。我添加了 z-index 但这似乎不起作用。我阅读了一些关于相对 z 索引不起作用的帖子，但有人可以帮我解决这个问题吗？

提前谢谢大家。亲切的问候，卢克86

Answer 1

要使用 X Y 位置定位元素，您应该使用 position: absolute;

如果您想将它定位在另一个元素内，请将 position: relative; 添加到容器中。