Question

我在div下面有一个链接，高度和宽度都是100％，位于固定位置，z-index：5。我需要将此div保留在我的链接之上，但链接不起作用。我可以使链接工作但是将此div保留在我的链接之上吗？

div {
  background:grey;
  width:100%;
  height:100%;
  position:fixed;
  top:0;
  opacity:0.5;
  z-index:5
}

a {
  font-size:50px;
  z-index:0
}

<a href="http://google.com"> My link</a>

<div></div>

Answer 1

您可以将pointer-events:none;添加到div的CSS规则

div {
  background:grey;
  width:100%;
  height:100%;
  position:fixed;
  top:0;
  opacity:0.5;
  z-index:5;
  pointer-events:none;
}

a {
  font-size:50px;
  z-index:0;
}

<a href="http://google.com"> My link</a>

<div></div>

Answer 2

如果这个div的目的只是改变背景颜色，那么删除它会更容易，而是这样做：

body{
    background-color:lightgrey;
}

如何在div可点击下方建立链接

2 个答案: