解决鼠标经过覆盖于低层级div的高层级div，依旧会触发低层级的hover属性的问题

背景

在写css的时候，发现高层级的div（用A表示，z-index为99）覆盖着低层级的div（用B表示，z-index为0）时，鼠标经过A与B重合的位置，依旧会触发被覆盖的B的hover事件
如下图所示：

解决办法

如果我们想在鼠标经过A与B重合的位置，不会触发被覆盖的B的hover事件，那么可以在A上面绑定hover,当A触发hover时，B设置pointer-events: none;，这样就不会触发B的hover事件

.A:hover .B {
	pointer-events: none;
}

pointer-events属性

pointer-events定义和用法：

pointer-events 属性定义元素是否对指针事件做出反应。

pointer-events属性值