在日常开发中，我们可能会遇到这样的需求：1.
有些元素是可以穿透的，我们点击并触摸它不会引发风暴，甚至可以穿透它下面的元素。
比如模态框的样式，防止按钮重复点击，遮罩可以穿透等。
例如：
在这个选项卡中，即使最后一个元素被半透明遮罩遮挡，我们通常仍然允许它可点击（因为这是一个可拖动的选项卡，不可能通过点击遮罩来选择最后一个选项卡元素）。
这时候我们都会有一个要求。 我们要求这个遮罩是可穿透的，我们需要通过穿透来点击它下面的元素。
事实上，这是相当麻烦的。 因为如果被删除的元素被隐藏，它的遮蔽效果也会消失。
但CS3中的一个新属性完美解决了一个问题。
Pointer-events CSS 属性指定在哪些情况下（如果有）特定图形元素可以成为键盘（和移动设备）事件的目标。
除了指示该元素不是键盘风暴的目标之外，值 none 还意味着键盘风暴“穿透”该元素并指定该元素“下方”的任何内容。
对于我们来说，只需要记住两个就可以了！
auto：默认值，不允许穿透。
无：可以穿透。
例如：
这里css模态框，当id为box的元素覆盖了id为pox的元素时，我们只需要添加一行pointer-events: none; 到箱子里css模态框，点击箱子就可以穿透它，直接触发痘风暴。
ps：当DOM元素指定了id属性时，不需要通过document.getElementById()来获取和定义，其id对应的值就是dom元素对应的变量。
模态应用
这个属性是我在看colorUI模态框源码时看到的。 主要是在模态框隐藏时将pointer-events的值改为none，这样模态框就不会影响页面了。 中的其他元素。 当显示模式框时，将pointer-events更改为auto。
兼容的：
Firefox 3.6+和chrome 2.0+ 以及safari 4.0+， IE11都支持这个CSS3属性。
