html - 覆盖 child 的 parent z-index

Question

我有这样的DOM部分

<div class="parent">
   <a class="link">Link me </a>
</div>

CSS:

.parent {
   z-index: -2;
}
.link {
 z-index:9999;
} 

我希望“parent”的一部分在之前的 div 下包裹 overlap/wrap。所以，我正在使用 z-index -2。无论我使用什么 z-index 链接，它都不可点击。任何建议。

PS:我不能为父级的前身 div 使用更大的 z-index。因为“parent”有 3 个 sibling (列)，不需要放在前任下。

Answer 1

那是因为父/子关系。如果父元素在另一个元素后面，它的子元素也会在后面。

但是如果它本身不包含任何链接，您可以将 pointer-events: none 添加到前一个(要重叠的)DIV。这将允许“点击它”。

注意:如果前面的 DIV 包含链接，那将不起作用，因为这些链接将不再起作用。