链接不适用于绝对位置
我有一个具有绝对位置的 div 和一个具有相对位置的 div 。第一个 div 包含链接，第二个 div 包含第一个 div 之上的一些内容。第一个 div 的 z-index 为 1，第二个 z-index 为 -1，第一个 div 也是首先声明的。
尽管如此，第一个 div 中的链接是不可点击的。我现在知道为什么会这样了。
side1 和 side2 都会有背景图像。内容应该显示在两侧，但链接应该仍然有效。
I have a div with a absolute position and a div with relative position. The first div contains the links and the second div contains some contents which is over the first div. The first div has a z-index of 1, while the second has a z-index of -1 and the first div is also declared first.
Although, the links in the first div are unclickable. I have now idea, why this is so.
Both side1 and side2 will have a background image. And the content should appear over the sides, but the links should still work.
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（4）
将
.side更改为z-index: 1，或将#container更改为margin-top: 150px> 而不是padding-top。#books的z-index为 1，但它位于z-index为 -1 的容器内，因此它最终仍然是在#container下方，它具有z-index: -1但在之后渲染（因此在顶部）。Either change
.sideto havez-index: 1, or change#containerto havemargin-top: 150pxinstead ofpadding-top.#bookshas az-indexof 1, but it's inside a container with az-indexof -1, so it still ends up below the#containerwhich hasz-index: -1but gets rendered after (thus on top).在你的代码中
我认为这就是原因。将
-1更改为1可以修复此问题。不确定我是否遗漏了某些内容，如果是，请在评论中解释和/或更新问题。In your code you have
I think this is the reason. Changing
-1to1fixes it. Not sure if I'm missing something, if so, please explain in comments and/or update the question.这些链接无法点击，因为 div 标签超出了它。
此标签：
为 .side2 元素提供较低的 z-index 以隐藏它。
the links are unclickable because a div tag is over leaping it.
This tag:
give the .side2 element a lower z-index to hide it.
您的第一个 div 和第二个 div 都共享类
.side，该类是使用z-index: -1定义的。因此，两者都位于同一堆栈级别，并且标记中最后出现的一个将位于前一个的顶部。您所要做的就是给.side1一个大于 -1 的 z-index 。Your first div and your second div, both share the class
.side, which is defined with az-index: -1. So both are on the same stack level and the one that comes last in the markup will be on top of the previous. All you have to do is to give.side1a z-index bigger than -1.