当我点击锚标签的外部时，它并没有带我到另一个页面

Question

当我点击锚标签的外部时，它并没有把我带到另一个页面

.section2 {
  display: flex;
  height: 60vh;
  z-index: -100;
}

.left {
  background: url('builder.jpeg');
  width: 50%;
  border: 6px solid black;
  margin: 10px;
  border-radius: 25px;
  z-index: -1;
}

.right {
  width: 50%;
  background: url('village.jpeg');
  border: 6px solid black;
  margin: 10px;
  border-radius: 25px;
  /* opacity: 0.5; */
  z-index: -1;
}

<div class="section2">

  <div class="split left">
    <a href="builder.html"> click me</a>
  </div>

  <div class="split right">
    <a href="village.html"> click me</a>
  </div>
</div>

锚标记中的上述代码没有将我带到另一个页面

Answer 1

.section2、.left 和 .right 的负面 z-index 将锚点下沉到“背景”中，使其无法点击。