css3 pointer-events:auto;详解

<style type="text/css">
    #div_grandfather{
        height : 250px;
        background: orange;
        300px;
        border:1px solid;
          pointer-events:none;
    }
    #div_parent{
        height:70%;
        background-color:#bbb;
        margin:30px;
        border: 1px solid;
   
  
    
    }
    #div_child{
        height:70%;
        background-color:deepskyblue;
        margin:30px;
        pointer-events:auto;
        
    }
</style>
<body>
    <div id="div_grandfather" onclick="alert('grandfather')">
        <div id="div_parent" onclick="alert('parent')">
            <div id="div_child" >
            </div>
        </div>
    </div>
</body>

https://codepen.io/a6965921/pen/vYyrGeP?editors=1010

 pointer-events:none;是隐蔽事件的

pointer-events:auto; 是开启事件的(允许一层层查找有没有事件)
从内到外  里面可以覆盖外面的

如果遇到什么不懂的地方直接关注公众号留言(本文版权归作者和博客园共有，欢迎转载，但未经作者同意必须在文章页面给出原文连接，否则保留追究法律责任的权利。)
作者：newmiracle
出处：https://www.cnblogs.com/newmiracle/