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. UE4.27 新版本像素流送插件配置

    UE4.27 像素流送新版插件部署命令 以下内容参考自UE5官方文档:https://docs.unrealengine.com/5.0/en-US/unreal-engine-pixel-strea ...

  2. ES6的模块化(export导出)

    ES6 Module把一个文件当作一个模块,每个模块有自己的独立作用域,那如何把每个模块联系起来呢?核心点就是模块的导入(import)与导出(export). 模块化的好处: 防止命名冲突 代码复用 ...

  3. spring boot权限设计资源

    源代码 https://github.com/2237995998/education 博客说明 https://blog.csdn.net/weixin_45138601/article/detai ...

  4. Hive. 函数 instr 的用法

    INSTR(C1,C2,I,J) 在一个字符串中搜索指定的字符,返回发现指定的字符的位置; C1 被搜索的字符串 C2 希望搜索的字符串 I 搜索的开始位置,默认为1 J 出现的位置,默认为1 sel ...

  5. C#TimeSpan时间差转换成分钟和秒数

    public Form1() { InitializeComponent(); aa = DateTime.Now.ToString(); } string aa; private void butt ...

  6. windows10安装ubuntu18.04(64位)双系统教程

    系统安装教程链接:https://www.cnblogs.com/masbay/p/11627727.html 系统安装完成后安装显卡驱动:https://ywnz.com/linux/4573.ht ...

  7. md5加密js内容

    避免以后都得百度,直接留一份存档 /* * A JavaScript implementation of the RSA Data Security, Inc. MD5 Message * Diges ...

  8. LoadRunner——block(块)技术

    一般情况下,loadrunner中的事务是统一执行的,多个事务所执行的次数是相同的,对于不同的事务执行不同的次数就要用到block(块)技术 block(块)技术主要应用于在一个脚本中实现不同事务.不 ...

  9. Java基础Day5-数组

    一.数组声明创建 首先必须声明数组变量,才能在程序中使用数组. 声明数组变量的语法如下: dataType[] arrayRefVar; 例如: int[] nums; Java语言使用new操作符来 ...

  10. 初次接触软构和git(使用eclipse)

    目录: 一.git和github 二.软件构造lab1常见问题(eclipse) 一.git和github 1. git的安装 百度git然后去官网安装即可,不会的可以去百度查一下. 2. git和g ...