CSS pointer-events 属性

CSS pointer-events 属性定义元素是否对指针事件做出反应。


实例

设置元素是否对指针事件做出反应:

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <style>
  5. div.ex1 {
  6. pointer-events: none;
  7. }
  8. div.ex2 {
  9. pointer-events: auto;
  10. }
  11. </style>
  12. </head>
  13. <body>
  14. <h1>pointer-events 属性</h1>
  15. <p>请把鼠标指针移至下面的链接,查看是否对指针事件做出反应:</p>
  16. <h2>pointer-events: none:</h2>
  17. <div class="ex1">访问 <a href="/html/html-course.html">HTML 教程</a></div>
  18. <h2>pointer-events: auto(默认)</h2>
  19. <div class="ex2">访问 <a href="/css/css-course.html">CSS 教程</a></div>
  20. </body>
  21. </html>

定义和用法

pointer-events 属性定义元素是否对指针事件做出反应。

默认值:auto
继承:
动画制作:不支持。请参阅:动画相关属性
版本:CSS3
JavaScript 语法:object.style.pointerEvents="none"

浏览器支持

表格中的数字注明了完全支持该属性的首个浏览器版本。

属性
pointer-events2.011.03.64.09.0

CSS 语法

  1. pointer-events: auto|none;
属性值
属性值描述
auto默认值。元素对指针事件做出反应,比如 :hover 和 click。
none元素不对指针事件做出反应。
initial将此属性设置为其默认值。参阅 initial
inherit从其父元素继承此属性。参阅 inherit

分类导航