css禁止文字被选中
有时候,为了让用户有更好的体验,需要禁用掉文本选中功能
比如:使用a标签模拟按钮,如果不禁用掉文本选中功能,那么双击时会选中文字,用起来很不爽。
多数情况下,只需要使用CSS样式就可以实现这个功能啦:
1 body{
2 -o-user-select: none;
3 -moz-user-select: none; /*火狐 firefox*/
4 -webkit-user-select: none; /*webkit浏览器*/
5 -ms-user-select: none; /*IE10+*/
6 -khtml-user-select :none; /*早期的浏览器*/
7 user-select: none;
8 }
user-select有四个值:
none:文本不能被选择
text:可以选择文本
all:当所有内容作为一个整体时可以被选择。如果双击或者在上下文上点击子元素,那么被选择的部分将是以该子元素向上回溯的最高祖先元素。
element:可以选择文本,但选择范围受元素边界的约束
值得注意的是:IE6-9目前需要通过JavaScript来实现。
1 document.body.onselectstart = document.body.ondrag = function(){
2 return false;
3 }
css禁止文字被选中的更多相关文章
- css 禁止文本被选中复制代码
css 禁止文本被选中复制代码: .cus-text{ -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none ...
- css设置禁止文字被选中
// 禁止文字被鼠标选中 moz-user-select: -moz-none; -moz-user-select: none; -o-user-select:none; -khtml-user-se ...
- css禁止鼠标双击选中文字
div{ -moz-user-select:none;/*火狐*/ -webkit-user-select:none;/*webkit浏览器*/ -ms-user-select:none;/*IE10 ...
- css设置文字不能选中状态
高版本浏览器的处理方式 -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-u ...
- [转]CSS禁止文字选择
user-select有两个值: none:用户不能选择文本 text:用户可以选择文本 需要注意的是:user-select并不是一个W3C的CSS标准属性,浏览器支持的不完整,需要对每种浏览器进行 ...
- 前端开发css禁止选中文本
在我们日常的Java web前端开发的过程中呢,程序员们会遇到各种各样的要求,所以不每天学的东西感觉自己都退步了,都更不上时代的发展了. 每天应对各种需求,每天活在疑问中就是我们程序员的真是写照.但我 ...
- css禁止双击dom节点被选中user-select:none
css禁止dom节点被选中: 当某个dom节点在快速重复点击的时候出现这个节点被选中,有时候其实并不希望出现这种情况,比如我们使用一个span或者a标签做为按钮dom元素的时候,快速双击这个按钮,就 ...
- 【css】CSS设置文字不能被选中
CSS设置文字不能被选中 /*设置文字不能被选中 以下为css样式*/ -webkit-user-select:none; -moz-user-select:none; -ms-user-select ...
- JS与CSS阻止元素被选中及清除选中的方法总结
有时候,我们希望阻止用户选中我们指定区域的文字或内容. 举个栗子,有时候用户在一个区域执行频繁的点击操作,一不小心傲娇地点多了,就会选中当前区域的内容. 再举个栗子,制作轮播组件的时候,点击下一页,若 ...
随机推荐
- VS编译器中设置 输出窗口 只显示error,不显示warning 要如何配置
VS编译器中设置 输出窗口 只显示error,不显示warning 要如何配置 在编译大型项目的时候,总是VS编译器的输出窗口总是会出现一堆warning警告,要想在里面找到error错误,要使用鼠标 ...
- day1_2_3
DD烧写命令(mfgtools-without-rootfs.tar.gz) ubuntu minicom svn 应用层进程阻塞调试 多机共享 securecrt的远程登录以及调试 tengxunt ...
- js中将字符串转为JSON的三种方式
1.eval方式解析,恐怕这是最早的解析方式了.如下: function strToJson(str){ var json = eval('(' + str + ')'); return json; ...
- Windows 7,无法访问internet,DNS无响应
我电脑网络连接显示有internet访问,但是网页打不开,QQ上不了,但可以PING通谷歌DNS 8.8.8.8,一PING域名就无法解析. 解决方法:开始-运行-输入"netsh wins ...
- [翻译]pytest测试框架(二):使用
此文已由作者吴琪惠授权网易云社区发布. 欢迎访问网易云社区,了解更多网易技术产品运营经验. 调用pytest 调用命令: python -m pytest [...] 上面的命令相当于在命令行直接调用 ...
- 令牌Token和会话Session原理与攻略
本篇文章将从无到完整的登录框架或API详细讲述登录令牌原理.攻略等安全点. 有些协议或框架也喜欢把令牌叫票据(Ticket),不论是APP还是Web浏览器,很多框架或协议都用到了本文所说的这套类似的认 ...
- PIP本地源搭建
Wheel包制作 # pip install wheel # mkdir ~/wheels # cd < Project > # pip wheel --wheel-dir=~/wheel ...
- Unable to round-trip http request to upstream: EOF问题
Unable to round-trip http request to upstream: EOF, 今天我用的phpstudy环境中的网站页面忽然打不开了,报错“Unable to round-t ...
- Servlet方法之service()
1.service一定要用吗?作用是什么?是不是在程序开始运行时,自动装载执行的系统方法(类似于main)? Service是类GenericServlet中最重要的方法,每次客户向服务器发出请求时, ...
- 【转】C#里partial关键字的作用
源地址:http://www.cnblogs.com/OpenCoder/archive/2009/10/27/1590328.html