The pointer-events property defines whether or not an element reacts to pointer events.
This CSS property specifies whether or not an element shows some action when the pointer event is triggered upon it. The pointer-events are triggered by touch, stylus, mouse click, and many more.
The pointer-events property controls how the HTML elements respond to events such as the CSS active/hover states, mouse/touch events, JavaScript click/tap events, and also controls whether or not the cursor is visible.
none: This value indicates that an element doesn't react to pointer events. It avoids all state, click, and the cursor options on the specified HTML element.
auto: It is the default value. It indicates that an element must react to pointer events such as the click and :hover.
pointer-events: auto|none;