Z-index 与可访问性
这是我在分层方面遇到问题的代码的简化。
<ul id="main_menu">
<li>Option 1
<ul id="submenu1">
<li>link</li>
<li>link</li>
<li>link</li>
</ul>
</li>
<li>Option 2
<ul id="submenu2">
<li>link</li>
<li>link</li>
<li>link</li>
</ul>
</li>
</ul>
我的问题是 submenu2 似乎高于选项 1。我尝试为它们提供适当的 z 索引,但它们似乎不起作用...我假设是因为 submenu2 是选项 2 的子项,并且没有与选项 1 相关。
是否有任何解决办法可以帮助解决我的问题?
我对大多数链接使用了大图形,因此重叠非常明显。
Here's a simplification of my code that I'm having problems with, in regards to layering.
<ul id="main_menu">
<li>Option 1
<ul id="submenu1">
<li>link</li>
<li>link</li>
<li>link</li>
</ul>
</li>
<li>Option 2
<ul id="submenu2">
<li>link</li>
<li>link</li>
<li>link</li>
</ul>
</li>
</ul>
My issue is that submenu2 seems to be above Option 1. I have tried to give them appropriate z-indexes, but they don't seem to work... I'm assuming because submenu2 is a child of Option 2, and has no relevance to Option 1.
Any idea of any work around that would help resolve my issue?
I'm using large graphics for most of these links, so the overlapping is quite obvious.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
z-index 仅适用于绝对定位的元素。正如我的评论员指出的那样,还有相对和固定的定位。我有点仓促的观点是,该元素必须从常规文档流中取出。
z-index only works with absolutely positioned elements. And as my commentators point out, relative and fixed positioning as well. My somewhat hurried point was that the element has to be taken out of the regular document flow.
如果没有看到 CSS,很难说清楚,但要使 z-index 正常工作,元素必须绝对定位、相对定位或固定定位。
Hard to tell without seeing the CSS, but for z-index to work properly, the element must be positioned either absolutely, relatively, or fixed.