允许指针事件通过嵌套div

Question

假设我有一个容器，如果我有css：

#nested2 {
    pointer-events:none;
}

除非我wrapper拥有pointer-events: none，否则它无效。问题是我想只有nested2有事件通过它而不是嵌套1。

发生了什么事？

Answer 1

您可以为整个pointer-events:none设置#wrapper，然后使用#nested1覆盖pointer-events:auto中的该样式：

#wrapper {
  pointer-events:none;
}
#nested1 {
  pointer-events:auto;
}

当然，这里的权衡是#wrapper将无法接收鼠标事件。但是我希望你对嵌套的div里面感兴趣。