你不知道的CSS系列白小霁1 MinutesJune 8, 2017

本博客关于CSS一些细小的知识点。大部分是来自笔者的面试经历和项目总结所得。

pointer-events

今天去面试了一家公司，有这样的一个需求是：使用纯的CSS禁止鼠标点击事件。
我们可以使用event.preventDefault()阻止事件的默认动作，使用event.stopPropagation()阻止事件冒泡；但是其实还有一种用纯css就能实现取消事件响应的方法：

1. 阻止用户的点击动作产生任何效果
2. 阻止缺省鼠标指针的显示
3. 阻止CSS里的hover和active状态的变化触发事件
4. 阻止JavaScript点击动作触发的事件
   当然很是存在一定的兼容问题，看这里。

   .disabled {
      pointer-events: none;
   }