z 索引问题

发布于 2024-08-30 16:25:23 字数 270 浏览 7 评论 0原文

我正在尝试使用 z-index 对按钮和 div 进行分层。该按钮出现在 div 后面,而根据 z-index 它应该位于 div 前面。这是与按钮相关的样式元素Firebug 捕获的 div:

请注意,按钮的 z 索引为 2,div 的 z 索引为 1,并且两者都是position:relative。

完整的 HTML 位于 此 Pastebin 中。

I'm trying to use z-index to layer a button and a div. The button appears behind the div, while according to z-index it should be in front of it. Here is the style elements associated with the button & div as captured by Firebug:

Note that the button has a z-index of 2, the div has a z-index of 1, and both are position:relative.

Full HTML is in this pastebin.

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

童话 2024-09-06 16:25:23

z-index 是相对值,而不是绝对值。

z-index 为 100 亿的对象不会出现在页面上所有元素的顶部,只会出现在同一堆栈上下文中的其他元素的顶部

http://css-discuss.incutio.com/wiki/Overlapping_And_ZIndex

http://tjkdesign.com/articles/z-index/teach_yourself_how_elements_stack.asp

在您发布的 CSS 层次结构中,看起来包含按钮和 div位于不同的元素(#note18#note19)中,因此您必须确保这些元素不会创建不同的堆叠上下文,这会导致任何 z 索引因为它们内部的元素彼此无关。

z-index is a relative, not an absolute value.

An object with z-index 10 billion will not appear on top of all elements on the page, only on top of other elements in the same stacking context

http://css-discuss.incutio.com/wiki/Overlapping_And_ZIndex

http://tjkdesign.com/articles/z-index/teach_yourself_how_elements_stack.asp

In the CSS hierarchy you posted, it looks like the button and div are contained in different elements (#note18 and #note19), so you'll have to make sure that those elements aren't creating different stacking contexts which will make any z-indexes for elements inside them irrelevant to each other.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文