在某些浏览器中，Html Canvas被绘制在元素之上，而不是其他浏览器

Question

我在当前网站上遇到问题，我正在尝试使用HTML画布添加一个简单的动画。我已将其他图像放在此画布的顶部。它在几个浏览器中都可以正常工作，但在Safari和Chrome中，画布正在绘制在我不希望它被绘制的图片之上，我不知道为什么。我试图搜索信息并弄乱z-index，但我不知道为什么这两个浏览器中的绘制顺序不同或者如何解决它。有没有人遇到类似的问题？

Answer 1

尝试将position: relative添加到IMG元素，并确保它们位于文档中的Canvas元素之后。

img { 
  position: relative; 
}