需求:现在有一个需求是在移动端让你禁止用户选中文字,你会怎么做呢?如下图

    

    解决方法:使用CSS3新增属性 user-select: none;     

  -webkit-user-select:none;
-moz-user-select:none;
-o-user-select:none;
user-select:none;

   该属性介绍:https://www.html.cn/book/css/properties/user-interface/user-select.htm#a3

   使用场景:

      ①:给某元素设置双击事件,若用户没有在第二次点击后迅速移开,就会选中文字

        

      ②:长按图片(可能你只是想保存图片,确出现复制文字的选项)

        

      ③:根据业务需要,要求明确禁止用户选中文字

      ④:在很多场景下,用户长按并非为了选定什么,比如拿着手机或ipad时,总是捏着屏幕中央

  兼容性:

     

      

    

CSS3禁止用户选中文字——user-select: none;的更多相关文章

  1. c# webbrowser  获取用户选中文字

    原文:c# webbrowser  获取用户选中文字 最近一直被一个问题困扰,有一个文本框,一个webbrowser控件,一个上下文菜单, webbrowser  获取用户选中文字" tit ...

  2. css禁止用户选中文本(转)

    body{ -moz-user-select:none;/*火狐*/ -webkit-user-select:none;/*webkit浏览器*/ -ms-user-select:none;/*IE1 ...

  3. css禁止鼠标双击选中文字

    div{ -moz-user-select:none;/*火狐*/ -webkit-user-select:none;/*webkit浏览器*/ -ms-user-select:none;/*IE10 ...

  4. 纯CSS如何禁止用户复制网页的内容?

    大家好,我是半夏,一个刚刚开始写文的沙雕程序员.如果喜欢我的文章,可以关注 点赞 加我微信:frontendpicker,一起学习交流前端,成为更优秀的工程师-关注公众号:搞前端的半夏,了解更多前端知 ...

  5. js禁止复制页面文字

    做项目的时候有客户提出要求,不能用用户浏览他发表的文章时复制他的文章 一种比较简单的方法,禁止用户选中页面的文字和禁止用户右键菜单 document.oncontextmenu = new Funct ...

  6. css取消双击选中文字

    在我们在写前端页面的时候,由于手速过快(当然这都是指的老司机),会经常双击,浏览器就会默认选中你双击的文本,这种感觉有点不太好. 这个时候就用到了 user-select:none; 属性. 因为存在 ...

  7. html body标签的几个属性 禁用鼠标右键,禁用鼠标选中文字等

    <body oncontextmenu='return false' ondragstart='return false' onselectstart ='return false' onsel ...

  8. css3应用之自定义选中文字的背景颜色

    在看很多的博客主题时候发现大多数都对选中文字的背景颜色做了相应的处理.其实这样是很符合用户体验的.因为有很多的人会用鼠标选择着一行一行的阅读.其中就包括本人... 浏览器中默认的选中的文字颜色为白色, ...

  9. 用js onselectstart事件鼠标禁止选中文字

    禁止鼠标选中文本,针对不同浏览器有不同的写法.常见的是onselectstart表示禁止鼠标选中文本.其中用js可以在页面中写 onselectstart="return false&quo ...

随机推荐

  1. Bootstrap-datepicker3官方文档中文翻译---Event/事件(原文链接 http://bootstrap-datepicker.readthedocs.io/en/latest/index.html)

    Events/事件 DatePicker在某些情况下触发一些事件.所有事件都拥有   传递给任何事件处理程序的  事件对象的    附加数据.(译者注:这里英语拗口,汉语也拗口,我用空格给大家断断句) ...

  2. Python之MySQL基础

    一.存储引擎 1.1  什么是存储引擎 MySQL中的数据通过不同的技术存储再文件或者内存中,每种技术有不同的存储机制,索引技巧,锁定水平,并且提供不同的能力,而实现这些技术的我们就称之为存储引擎 1 ...

  3. ISP基本框架及算法介绍

    什么是ISP,他的工作原理是怎样的? ISP是Image Signal Processor的缩写,全称是影像处理器.在相机成像的整个环节中,它负责接收感光元件(Sensor)的原始信号数据,可以理解为 ...

  4. mybatis 中使用 in 查询

    转:http://www.cnblogs.com/xusir/archive/2013/07/24/3210286.html 当查询的参数只有一个时 a 如果参数的类型是List, 则在使用时,col ...

  5. 从svn迁移至Git并保留所有 commit 记录

    用户映射文件user.txt,等号左边为svn账号,右边为Git用户名和邮箱.注意:svn中有多少用户就要映射多少 test1=test1<147258369@qq.com>test2=t ...

  6. C. 新年的繁荣

    题解: 用最小生成树的Boruvka算法 即每次找到每个点不在它联通块的边内的最大值 然后进行log次这个过程 然后找这个的话我们可以用trie树在2^m的时间内完成建树(如果是1要合并到0上)

  7. Nginx 如何设置反向代理 多服务器,配置区分开来,单独文件保存单个服务器 server 主机名配置,通过 include 实现

    samcao 关注 2015.06.15 10:08* 字数 0 阅读 408评论 0喜欢 0   网络结构如上图.可能你只有一个公网的Ip地址. 但是您的内网有个网站需要映射至外网.而又不想添加其它 ...

  8. Imcash:一边大裁员,一边大扩招,你能否成为区块链人才中的7%?

    农历春节后,互联网创业圈并不太平. 最早,滴滴被曝裁员,占比约为全员的15%,涉及员工约2000人.CEO程维在全员会议上称公司要做好过冬准备.此后,京东接棒,其裁员对象上升至副总裁级别高管,比例占到 ...

  9. hdu 3478 Catch--二分图判断

    我觉得,给了初始点的话用bfs方便点,没有则dfs ||可能超片面 https://vjudge.net/contest/281085?tdsourcetag=s_pcqq_aiomsg#proble ...

  10. JavaOOP笔记

    http://note.youdao.com/noteshare?id=bbdc0b970721e40d327db983a2f96371