CSS pointer-events: none 去掉鼠标事件

CSS pointer-events: none 去掉鼠标事件

点击打开视频讲解地址
pointer-events: none 顾名思义，就是鼠标事件拜拜的意思。
元素应用了该 CSS 属性，链接啊，点击啊什么的都不起作用了。
pointer-events: none 的作用是让元素实体 “虚化”。
例如一个应用 pointer-events: none 的按钮元素，则我们在页面上看到的这个按钮，只是一个虚幻的影子而已，
您可以理解为海市蜃楼，幽灵的躯体。当我们用手触碰它的时候可以轻易地没有任何感觉地从中穿过去。

大家都知道 input[type=text|button|radio|checkbox] 支持 disabled 属性，可以实现事件的完全禁用。
如果其他标签需要类似的禁用效果，可以试试 pointer-events: none

pointer-events: none 去掉鼠标事件
pointer-events: auto 恢复鼠标事件

举个简单的例子：

	<a href="http://sf.gg" style="pointer-events: none">click me</a>

这个链接，你是点不了的，并且 hover 也没有效果。
值得一提的是，仅仅是鼠标事件失效，用 tab 键还是可以选中该链接的，然后 enter 打开，这个时候可以去掉 a 标签的 href 属性，就不能让 tab 键选中了
不局限于a链接，其它元素的鼠标事件（例如，div,p等）也可以去除。