覆盖 DIV 及其内外的链接

Question

有没有办法让我在叠加 DIV 和 DIV 后面的表面上都可以点击链接？

我知道 POINTER-EVENTS: None; 但在这种情况下这不是解决方案，因为它只会使链接在覆盖层 DIV 后面的表面上可点击，从而使 DIV 中的链接不可触摸。

抱歉，如果这是一个重复的问题。

Answer 1

这里你要的属性是z-index。具体来说，你想让它在你想要点击的锚标签上比在 header.

上更高

首先，您需要将 class 添加到锚标记（我们称其为 above-header）以明确说明，以便所有链接都如下所示：

<A href="https://www.google.com" class="above-header">Link</A>

然后您需要添加以下内容 CSS 以将新定位应用于锚标记：

.above-header {
   position: relative;
   z-index: 1001;
}

position: relative 将使 z-index 适用于那些锚标签而不移动它们，而 z-indez 会将它们提升到 header 之上（并使它们可点击) 只要它们的 z-index 值大于 header 的值（当前为 1000）。

我还会将 .header-area 上的 z-index 降低到 1，然后将锚标签上的 z-index 设为 2，但这主要是代码风格的问题。