CSS3之pointer-events属性

属性指定在什么情况下 (如果有) 某个特定的图形元素可以成为鼠标事件的 target。
该属性有很多个属性值，但对浏览器来说，只有 auto 和 none 两个属性值可以用， 其它属性值都是只针对 svg 有效

• auto效果和没有定义 pointer-events 属性相同，为默认属性值，当前情况下，鼠标不会击穿当前层。
• none被只当该属性值的元素，不再是鼠标事件的目标，鼠标不再监听当前层，而去监听下面的层中的元素，但是如果它的子元素设置了 pointer-events 属性为其它值，比如 auto，鼠标还是会监听到这个子元素。在这种情况下，鼠标事件将在捕获或冒泡阶段触发父元素的事件侦听器。

总结

1. 若HTML 上两个元素没有包含关系，鼠标事件就不会在这两个元素之间传递，而上层的元素会覆盖下层的元素，导致下层的元素捕获不到事件。将上层元素 pointer-events：none；则上层元素将不再捕获事件，那么事件将被下层元素捕获到。
2. 若HTML 上两个元素之间有包含关系，那么子元素获得鼠标事件后，会传递给父元素。