本章给大家介绍一个css3中超实用的属性：CSS3 pointer-events属性。有一定的参考价值，有需要的朋友可以参考一下，希望对你们有所帮助。
最近发现了一个叫pointer-events的css属性，是一个与javascript有关的属性，pointer-events直译为指针事件，当把值设置为none后，他有如下相关特性。
阻止用户的点击动作产生任何效果
阻止缺省鼠标指针的显示
阻止Css里的Hover和Active状态的变化触发事件
阻止Javascript点击动作触发的事件
一条CSS可以做许多事情是不是很神奇，我们在看一下兼容性情况如何。
IE 11+
Firefox 3.6＋
Chrome 4.0+
Safari 6.0
Opera 15.0
iOS Safari 6.0
Android Browser 2.1+
Android Chrome 18.0+
效果图查看：https://runjs.cn/detail/9rxdbuin
代码：
<!DOCTYPE html>
<html>
<head>
<style>
a.noLink{pointer-events: none;}
.bottom { background: yellow; width: 100px; height: 100px; }
.top { width: 100px; height: 100px; position: absolute; top: 0; left: 0;background:rgba(0,0,0,.2);}
.top span{margin-top:50px;display:inline-block}
</style>
<script id="jquery_183" type="text/javascript" class="library" src="/js/jquery-1.8.3.min.js"></script>
</head>
<body>
<div>
<!-- 下方div --> <div class="bottom"> <a href="www.baidu.com">bottom-百度</a> </div>
<!-- 上方div --> <div class="top"><span>我是上层top</span></div>
<button id="btnP">
添加pointer-events
</button>
</div>
</body>
<script>
$('#btnP').click(function(){
$('.top').css('pointer-events', 'none')
})
</script>
</html>以上是CSS3 pointer-events属性介绍的一个实例，大家可以自己动手编译试试，看看效果。
Atas ialah kandungan terperinci CSS3中的pointer-events属性介绍. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!
tutorial css3
Apakah sifat kecerunan css3?
arahan fail cari linux
kekunci pintasan baldi cat ps
Perkara yang perlu dilakukan jika desktop jauh tidak dapat disambungkan
Hubungan antara lebar jalur dan kelajuan rangkaian
Windows 10 menjalankan pengenalan lokasi pembukaan
Bagaimana untuk menukar perisian bahasa c ke bahasa Cina
![[Web front-end] Permulaan pantas Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
