CSS3禁止网页中文本被选中代码
通常大家会有js来实现,另一个方案就是,将-webkit-user-select 和-moz-user-select 的值设为none,这针对于移动用户,可能会很有用。
请谨慎使用这个属性:因为大部分用户是来查看信息的,他们可以复制并存储下来以备将来之用,所以这种方法既无用也无效。如果你禁用了复制粘贴功能,用户还是可以通过查看源文件来获取到他们想要的内容。
body {
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
上面的代码兼容所有移动设备的浏览器,下面我们来看看关于user-select的一些介绍。
附:user-select的介绍
user-select是在css3 UI规范中新增的一个功能,用来控制内容的可选择性。
语法
user-select:value;
可选参数
auto——默认值,用户可以选中元素中的内容
none——用户不能选择元素中的任何内容
text——用户可以选择元素中的文本
element——文本可选,但仅限元素的边界内(只有IE和FF支持)
all——在编辑器内,如果双击/上下文点击发生在子元素上,改值的最高级祖先元素将被选中。
-moz-none——firefox私有,元素和子元素的文本将不可选,但是,子元素可以通过text重设回可选。
.selectDemo{
background-color:#eee;
padding:20px;
-moz-user-select: none;
-webkit-user-select: none;
-ms-user-select: none;
}
如果想支持所有的我们可以
<script type="text/Javascript">
document.oncontextmenu=function(e){return false;};
document.onselectstart=function(e){return false;};
</script>
<style>body{-moz-user-select:none;}</style>
加上这一句即可
【原文链接】
CSS3禁止网页中文本被选中代码的更多相关文章
- 【学】CSS3基础实例1 - 用CSS3做网页中的小三角,以及transition的用法
自开了博客园已经有2周了吧,虽然转载了一些觉得比较有用的文章之外还没有开始写自己的一些学习记录,那就从今天开始. 目前看了妙味的不少视频,有css+html,js的基础和中级也都看完了,作业也都做了, ...
- textarea中文本高亮选中
最近在实现原文/译文句段高亮对比显示,和有道翻译类似,如下图所示: 最初的解决方案是采用富文本编辑器,把所有句段信息都用HTML标签包裹,操作空间比较大,页面上需要的功能几乎都可以实现,但是由此带来了 ...
- js随笔,css和js禁止网页选择文本,table的class样式使得td的class样式失效,jquery获得元素坐标
css使用user-select,user-select不是W3C标准,浏览器支持不完整:user-select有两个值,none用户不可以选择文本,text用户可以选择文本 body{-moz-us ...
- css3制作网页中常见的小箭头
/* css3三角形(向上 ▲) */ div.arrow-up { width:0px; height:0px; border-left:5px solid transparent; /* 右透明 ...
- 网页中插入Flash动画(.swf)代码和常用参数设置
我们现在大部分人做网页,都是直接用DW插入flash,而且DW也是所见即所得,直接生成了相应的flash显示代码.可是我们又有多少人了解这些直接由DW生成的代码呢?其实我接触flash player标 ...
- java正则表达式移除网页中注释代码
/** * 移除网页中注释掉的代码 * * @param str * @return */ public static String removedisablecode(String str) { P ...
- HTML之:让网页中的<a>标签属性统一设置-如‘新窗口打开’
在开发过程中,我们往往想在页面中,给<a>设置一个统一的默认格式,例如我们想让链接:“在新窗口打开”,我们就可以使用<base>标签 在网页中添加这段代码: <head& ...
- 网页中flash设置
我们现在大部分人做网页,都是直接用DW插入flash,而且DW也是所见即所得,直接生成了相应的flash显示代码.可是我们又有多少人了解这些直接由DW生成的代码呢?其实我接触flash player标 ...
- JQuery模拟网页中自定义鼠标右键菜单
题外话.......最近在开发一个网站项目的时候,需要用到网页自定义右键菜单,在网上看了各路前辈大神的操作,头晕目眩,为了达到目的,突然灵机一动,于是便有了这篇文章. 先放个效果图(沾沾自喜,大神勿喷 ...
随机推荐
- PAT 甲级 1012 The Best Rank
https://pintia.cn/problem-sets/994805342720868352/problems/994805502658068480 To evaluate the perfor ...
- dede5.7文章模型(非软件模型)添加下载附件的方法
添加字段 ---- > 字段类型为 附件 --- - > templets/system/channel_addon.htm 代码清空,只保留 ~link~ -+---> 保存. & ...
- [STL] map,multimap,unordered_map基本用法
map的特性是,所有元素都会根据元素的键值自动被排序.map的所有元素都是pair,同时拥有键值(key)和实值(value).pair的第一元素被视为键值,第二元素被视为实值.map不允许两个元素拥 ...
- Binding自动侦听
WPF的强大之一就是数据绑定,Binding是数据桥梁,它的两端是分别是源(Source)和目标(Target),一个简单的类的属性值发生变化,会自动反映在UI界面上,这个属性就是Binding的Pa ...
- 【Python】python更新数据库脚本两种方法
最近项目的两次版本迭代中,根据业务需求的变化,需要对数据库进行更新,两次分别使用了不同的方式进行更新. 第一种:使用python的MySQLdb模块利用原生的sql语句进行更新 1 import ...
- BZOJ 1046 上升序列(LIS变形)
要保证长度为L的序列下标字典序最小,当然要尽量选前面的数. 如何判断前面的数是否满足条件?,只需要知道这个数开头的递增序列的最长长度是多少,如果不小于L,那么必然可以加入这个数.还需判断一下它是否大于 ...
- Python re(正则表达式)模块
python正则表达式 正则表达式是一个特殊的字符序列,它能帮助我们方便的检查一个字符串是否与某种模式匹配.Python自1.5版本起增加了re模块,它提供Perl风格的正则表达式模式.re模块使Py ...
- BZOJ 3040最短路
题目描述 给定一个 NN 个点, MM 条有向边的带权图,请你计算从 SS 出发,到每个点的距离. 数据保证你能从 SS 出发到任意点. 输入输出格式 输入格式: 第一行两个整数 NN . MM ,表 ...
- 状态压缩---UVA6625 - Diagrams & Tableaux
比赛的时候刷出来的第一个状态DP.(期间有点没有把握是状态DP呢.) 题意:题意还是简单的.K行的方格.之后输入L1~LK 代表每一行方格数.在这些往左紧挨的方格子里填上1~N的数字. 其中右边格子的 ...
- 【刷题】BZOJ 4827 [Hnoi2017]礼物
Description 我的室友最近喜欢上了一个可爱的小女生.马上就要到她的生日了,他决定买一对情侣手 环,一个留给自己,一个送给她.每个手环上各有 n 个装饰物,并且每个装饰物都有一定的亮度.但是在 ...