css - z-index 问题 : svg element appearing behind canvas elements when it shouldn't be

标签 css html svg html5-canvas z-order

在过去的几个小时里,我一直在尝试制作《黑暗骑士归来》封面的 HTML5 版本(带有闪电的那个)。

我已经差不多完成了,但是我制作的 svg bat 侠拒绝走到 Canvas 前!

有问题的页面位于:http://scaryg.nom.es/playthings/lightningbadsvg

我看了看,svg 元素似乎找到了正确的 css 规则,我尝试在初始化过程中将 Canvas 重置为正确的 z-index(以及设置为正确的 z-index在样式表中)。

一切都在一页上(甚至是 svg),我很难过。 谢谢

最佳答案

您在将样式应用于 svg 时出错:

position:absolute: top:30%;

请注意 absolute 之后的冒号而不是分号。解决这个问题, bat 侠就会领先。

尝试使用 Developer tools 或 Firebug 等工具来检测这些类型的问题。

关于css - z-index 问题 : svg element appearing behind canvas elements when it shouldn't be,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11200403/

相关文章:

javascript - SVG:导出动画

CSS - 如何防止没有内容的DIV缩小

html - 在 MVC 和 jQuery Mobile 中基于设备宽度和高度重定向

javascript - Next.js Jest 28 - 无法转换 SVG 文件

jquery - 响应式导航 'max-height' 问题(CSS3 转换)

html - 如何将按钮放在输入旁边?

SVG - 填充路径的孔(透明部分)

html - 为什么会出现水平滚动条

html - 填充不均匀大小的 float 元素留下的空间

jquery - 为什么我的 jquery not 选择器不起作用