叠加DIV及其内部和外部的链接

Question

我是否可以通过一种方法使链接在重叠式DIV中以及DIV后面的表面上都可单击？

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

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

Answer 1

您要在此处设置的属性为z-index。具体来说，您要使其在要单击的锚标记上比在标头上高。

首先，您需要为锚标记添加一个类（我们将其称为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会将它们提升到标题上方（并使它们可点击），只要它们的{ {1}}的值大于标头的值（当前为1000）。

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