Css 样式点击穿透

什么是pointer-events？

pointer-events 属性是一个指针属性，是用于控制在什么条件下特定的图形元素可以成为指针事件的目标。

This CSS property,when set to “none” allows elements to not receive hover/click events,instead the event will occur on anything behind it.

当这个属性设置为none时，元素则不接收hover、click事件，由他后面的元素进行接收。

/* Keyword values */

pointer-events: auto;

pointer-events: none;

pointer-events: visiblePainted; /* SVG only */

pointer-events: visibleFill; /* SVG only */

pointer-events: visibleStroke; /* SVG only */

pointer-events: visible; /* SVG only */

pointer-events: painted; /* SVG only */

pointer-events: fill; /* SVG only */

pointer-events: stroke; /* SVG only */

pointer-events: all; /* SVG only */

/* Global values */

pointer-events: inherit; 从其父元素继承此属性

pointer-events: initial; 将此属性设置为其默认值