pointer-events 属性用于设置元素是否对鼠标事件做出反应。

CSS 语法

pointer-events: auto|none;

属性值

属性值 描述
auto 默认值,设置该属性链接可以正常点击访问。
none 元素不能对鼠标事件做出反应
initial 设置该属性为它的默认值,查看更多initial
inherit 从父元素继承该属性, 查看更多 inherit
/* 属性值 */
pointer-events: auto;
pointer-events: none;
pointer-events: visiblePainted; /* 只适用于 SVG */
pointer-events: visibleFill; /* 只适用于 SVG */
pointer-events: visibleStroke; /* 只适用于 SVG */
pointer-events: visible; /* 只适用于 SVG */
pointer-events: painted; /* 只适用于 SVG */
pointer-events: fill; /* 只适用于 SVG */
pointer-events: stroke; /* 只适用于 SVG */
pointer-events: all; /* 只适用于 SVG */ /* 全局值 */
pointer-events: inherit;
pointer-events: initial;
pointer-events: unset;

JS代码改变例子:

document.getElementById("div1").style.pointerEvents = "none";

CSS pointer-events 属性的更多相关文章

  1. CSS之cursor属性

    CSS之cursor属性 今天学习了CSS的cursor属性,第一篇博客就用来总结它吧. cursor属性用于控制光标的显示样式,可取的值有这些: cursor:url()*|{auto|defaul ...

  2. 浏览器 Pointer Events

    前言 Pointer Events是一套触控输入处理规格,支持Pointer Events的浏览器包括了IE和Firefox,最近Chrome也宣布即将支持该处理规则. PointerEvent Po ...

  3. CSS Counters 计数属性

    CSS Counters其实就是一计数器,早期在CSS中计数器仅存在于ul和ol元素.如果要使用在div这样的元素上,只能通过list-style-image或者是元素的backgroud-image ...

  4. css 的pointer-events 属性

    1.css 有好多属性,可以让你感觉到不可思议,关键是可以解决一些难以实现的问题,今天遇到一个,就是 point-enevts属性 支持 pointer-events 属性 的浏览器版本 2. 1  ...

  5. DIV css中cursor属性详解-鼠标移到图片变换鼠标形状 (转)

    css中cursor属性详解-鼠标移到图片变换鼠标形状   语法: cursor : auto | all-scroll | col-resize| crosshair | default | han ...

  6. css标签及属性

    css标签及属性 HTML引入CSS的方法 1.嵌入式  <style type = “text/css”>要写的样式</style> 2.外联式  <link rel ...

  7. CSS样式常用属性整理

    web工程师是最近5年刚刚兴起的一门高薪职业,人们的专注度越来越高. 那么前端除了学习html标签之外还需要掌握什么知识点呢? 为大家整理了一个和HTML标签密不可分的知识要点--<CSS样式常 ...

  8. CSS中box-sizing属性的理解与部分用法

    今天看了一些关于box-sizing的一些资料,在这里整理一下,希望也能对大家有所帮助. box-sizing是CSS的一个属性,很好的解决了盒模型的相关问题.CSS中的盒模型(Box model)分 ...

  9. 深入理解css中position属性及z-index属性

    深入理解css中position属性及z-index属性 在网页设计中,position属性的使用是非常重要的.有时如果不能认识清楚这个属性,将会给我们带来很多意想不到的困难. position属性共 ...

  10. 利用CSS的@font-face属性 在网页中嵌入字体

    字体使用是网页设计中不可或缺的一部分.网页是文字的载体,我们希望在网页中使用某一特定字体,但是该字体并非主流操作系统的内置字体,这样用户在浏览页面的时候就有可能看不到真实的设计. 美工设计师最常做的办 ...

随机推荐

  1. 新版 Mediasoup Windows 安装 编译

    https://vc.feiyefeihua.top/ ps:视频测试demo,服务器配置很低,加载有点慢:需要有音视频设备,不然会报错. 关于官网文档 官网文档地址 只测试了 Windows .讲的 ...

  2. unity 发布WebGL版本找不到unity自带的类

    加载asset bundle的时候出现Could not produce class with ID XXX的错误 在asset 文件夹下建一个Link的XML,内容如下: <?xml vers ...

  3. 苹果Macbook快捷键使用大全

    苹果电脑Macbook快捷键如何使用?很多小伙伴经常询问小编有关于苹果电脑的相关问题,其实很多快捷键都可以提高生产力,那么接下来一起看看苹果Macbook快捷键使用大全! 苹果电脑Macbook快捷键 ...

  4. Linux下查看服务器PCIE Slot槽位信息

    在linux系统下,可以使用"dmidecode –t 9"或者"dmidecode –t slot"命令查看PCIE Slot的信息,如下图所示RH2288H ...

  5. 我的第三次JAVA作业

    ------------恢复内容开始------------ 1.对象与对象引用的区别是什么? 请举例说明 创建对象被分配在堆中,对象引用分配在栈中. eg. new FighterPlane(); ...

  6. vscode python配置pip源

    更换到国内清华园 C盘-User-用户名-新建"pip"文件夹-新建"pip.ini"文件 pip.ini 文件中内容: [global]index-url = ...

  7. Vue3注册全局组件

    1. Vue3全局组件注册 components文件夹下新建index.js文件,统一引入需要注册的组件 import CustomCheck from "./CustomCheck.vue ...

  8. Erlang Mnesia数据库迁移方法

    本文参考https://blog.csdn.net/yangzm/article/details/51686249 需求 因为一些原因,需要把一个Mnesia节点的数据库搬迁到另一个节点,然后弃用原来 ...

  9. nuxt.js的导航守卫

    一.使用router.js 重构项目时还行使用原来的router.js也是可以的,需要下载插件惊醒配置,这时候vue-cli中怎么用,nuxt中就怎么使用导航守卫,几乎一样 二.使用nuxt.js 1 ...

  10. linux-vi/vim常用操作键

    命令模式: :w 将编辑的数据写入硬盘档案中(常用) :w! 若文件属性为『只读』时,强制写入该档案.不过,到底能不能写入, 还是跟你对该档案的档案权限有关啊! :q 离开 vi (常用) :q! 若 ...