Html 如何将静止图像直接覆盖在旋转图像的顶部？

我有一个旋转的轮子，它旋转着落在奖品上。问题是，在那个轮子旁边有一个指向中奖的红色箭头，这个红色箭头会根据屏幕的大小和方向移动一点，因为它是一个响应迅速的应用程序

我认为一个很好的解决方案是在旋转箭头的上方覆盖一个箭头的静止图像。我想这将确保箭头始终指向正确的奖品

如果我把该图像的html代码直接放在旋转图像的代码旁边，我知道它会把它放在彼此的旁边/下面。如何在同一位置覆盖两个图像

这是有问题的页面，如果这有帮助的话

---

非常感谢您对我如何学习或执行此操作的指导。

这很难诊断，因为您需要一个代码来转动方向盘。我可以想出一些可能的答案，但根据我所看到的

看起来您正在使用flexbox和一些JS来旋转轮子，这意味着您对两者都很满意。轮子和多边形位于容器内

要执行要求的操作，请将适当的父元素设置为

位置：relative

，在绝对位置添加另一个多边形，并将“真实多边形”设置为“不可见”。有几种方法可以做到这一点

1） 显示：无 使用javascript将多边形设置为

display:none

，并在奖品出现时将其替换为正确的朝向箭头。 如果不清楚如何实现这一点，请查看如何使用JS更改类或如何使用JS更改CSS样式。还要了解如何将子元素插入JS。（必须以父元素为目标-#图表容器）

2） 可见性：隐藏 使用javascript将多边形设置为

可见性：隐藏

，并在奖品出现时将其替换为正确的朝向箭头

---

但是，用户可能会注意到，因为您正在删除和替换多边形。另外，将正确的父元素设置为相对位置将确定绝对箭头的初始边界。

谢谢您的建议。实际上我对flexbox并不熟悉，我的应用程序是由其他人开发的。我有C#和Unity的经验，但除了一些基本的HTML之外，我几乎没有网页设计方面的知识。我能读javascript，但不能用它编码。我正在尽我所能去学习，因为我想给它添加很多功能。但是我会根据你的描述尽我所能去弄清楚。谢谢你的建议。啊，好的。那很酷。不管怎么说，你想把它修好，真是太好了！作为额外的参考，

display:none

从页面设计中删除整个元素，但它仍然存在于代码中，以便在需要将其“放回”到设计中时使用<代码>可见性：隐藏的只会使元素不可见，但它仍然在那里占据空间。HTML将一个元素堆叠在另一个元素的上面/旁边，从左上到右下，因此这两个选项将更改页面对用户的外观/行为。祝你好运