javascript - z-index : -1 is not clickable 下的 div

Question

您好，我目前有一个页面，上面有多个图层，我在背面设置了这个内容容器。在我的 styles.css 中这是我的代码

#content-container{
/**position**/
position: absolute;
top: 0px;
padding-top: 80px;
padding-left: 80px;
z-index: -1 !important;
/**size**/
width: 100%;
height: 100%;
}

这里还有account-container代码

#account-container {
/**position**/
float:right;
margin-top:2px;
margin-right:-60px;

/**size**/
width: 350px;
height: 220px;
border-radius: 5px;

/**color**/
color:black;
background-color: white;

我设置这个是因为我有这个accounts-container，当点击应该在content-container上方时，这里是它的样子

正如您在右上角看到的那样，它是 accounts-container 但发生的是 div content-container 不再可点击有什么想法吗？

Answer 1

如果您的“帐户容器”上方(更高的 z-index)有任何“层”，则此容器(透明部分)必须具有 CSS 属性 pointer-events设置为无:

.whatever {
  pointer-events: none;
}

这将防止将点击事件定位到叠加层。