CSS实现禁止文字选中
E10平台预览第四版中包含了对 CSS3 新属性 -ms-user-select 的支持,Web 开发人员可以利用这一新属性轻松精确的控制用户可以在网站上选择哪些文本。
user-select:none | text | all | element
- text – 可以选择文本
- element – 可以选择文本,但选择范围受元素边界的约束
- none – 不可以选择文本
- auto – 如果该元素包含可编辑的文本(如输入元素或可编辑内容的元素),则可以选择文本。否则,元素内容是否可选择由父节点的值决定。
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<title>主页</title>
<style type="text/css">
.row-of-icons {
-webkit-user-select: none; /* Chrome all / Safari all */
-moz-user-select: none; /* Firefox all */
-ms-user-select: none; /* IE 10+ *//* No support for these yet, use at own risk */
-o-user-select: none;
user-select: none;
}
</style>
</head>
<body>
<div class="row-of-icons" onselectstart="return false;" unselectable="on">选择我试试,你会发现怎么也选择不到我,哈哈哈哈</div>
</body>
</html>
CSS实现禁止文字选中的更多相关文章
- css设置禁止文字被选中
// 禁止文字被鼠标选中 moz-user-select: -moz-none; -moz-user-select: none; -o-user-select:none; -khtml-user-se ...
- css控制页面文字不能被选中user-select:none;
现象:html中可能有些地方不想让用户复制文字,或是用a标签做了个点击按钮,点快的时候文字会被选中,很丑,这个时候可以使用下面的方案禁止文字选中. 原因:鼠标点快了文字会被选中. 解决方案:不同的浏览 ...
- CSS3禁止用户选中文字——user-select: none;
需求:现在有一个需求是在移动端让你禁止用户选中文字,你会怎么做呢?如下图 解决方法:使用CSS3新增属性 user-select: none; -webkit-user-select:non ...
- CSS阻止页面双击选中文本
转载自:w3cui 在双击左右箭头,快速切换图片滚动时,会选择附近区域的文字,感觉不是很好,今天在同事在分享时,讲到了这个问题, 试了一下,不错,解决了问题IE及Chrome下的方法一样,对相应的元素 ...
- JS与CSS阻止元素被选中及清除选中的方法总结
有时候,我们希望阻止用户选中我们指定区域的文字或内容. 举个栗子,有时候用户在一个区域执行频繁的点击操作,一不小心傲娇地点多了,就会选中当前区域的内容. 再举个栗子,制作轮播组件的时候,点击下一页,若 ...
- 纯CSS如何禁止用户复制网页的内容?
大家好,我是半夏,一个刚刚开始写文的沙雕程序员.如果喜欢我的文章,可以关注 点赞 加我微信:frontendpicker,一起学习交流前端,成为更优秀的工程师-关注公众号:搞前端的半夏,了解更多前端知 ...
- css实现标题文字过长截取...
css实现网页中文字过长截取... title class应该这样写: .title{ width:300px; white-space:nowrap; overflow:hidden; text-o ...
- CSS样式 解决文字过长显示省略号问题
一.CSS样式 解决文字过长显示省略号问题 1.一般样式 一般 css 样式,当宽度不够时,可能会出现换行的效果.这样的效果在某些时候肯定是不行的,可以修改 css 样式来解决这个问题. <!D ...
- js页面文字选中后分享到新浪微博实现
demo您可以狠狠地点击这里:js文字选中分享到新浪微博demo 方法与代码 选中即分享的功能看上去比较高级,其实实现是相当简单的.其中的会让人头大,一般人也不感兴趣的原理这里就直接跳过.这个js文字 ...
随机推荐
- [Unity工具]CSV工具类
参考链接: https://www.cnblogs.com/lulianqi/p/6385503.html http://blog.csdn.net/paul342/article/details/2 ...
- PHP获取中文首字母的函数
PHP获取中文首字母的函数 <?php header("Content-type: text/html; charset=utf-8"); function getFirst ...
- 2.App爬取相关库的安装(安装mitmproxy)
mitmproxy 是一个支持HTTP 和HTTPS 的抓包程序,类似fiddler,Charles的功能(它通过控制台的形式操作). mitmproxy 两个关键的组件:mitmdump 和 mit ...
- 7.纯 CSS 创作一个 3D 文字跑马灯特效
原文地址:https://segmentfault.com/a/1190000014663038 感想:简单的从右到左动画 HTML代码: <div class="box"& ...
- 函数getpass
函数getpass为python自带函数,作用是使用户输入的内容不可见 1 # -*- coding:utf-8 -*- 2 import getpass 3 a = raw_input(" ...
- numpy+pandas 基础学习
#-*- coding:utf-8 -*- import numpy as np; data1=[1,2,3,4,5] array1=np.array(data1) #创建数组/矩阵 # 使用nump ...
- NAS 百科 —— http://baike.baidu.com/item/NAS%E7%BD%91%E7%BB%9C%E5%AD%98%E5%82%A8
NAS(Network Attached Storage)网络存储基于标准网络协议实现数据传输,为网络中的Windows / Linux / Mac OS 等各种不同操作系统的计算机提供文件共享和数据 ...
- JMeter做http接口功能测试
1. 普通的以key-value传参的get请求 e.g. 获取用户信息 添加http请求:填写服务器域名或IP:方法选GET:填写路径:添加参数:运行并查看结果. 2. 以Json串传参的post请 ...
- 错误:SyntaxError: Missing parentheses in call to 'print'
1.Python3编译器使用print函数需加括弧 print(XXX) 而Python 2可以print XXX 2.Python3表示不等只能用"!=" 3.在python3中 ...
- 在Ubuntu 14.04 64bit上安装百度云Linux客户端BCloud
参考:https://www.cnblogs.com/kluan/p/6014989.html 下载 网盘安装包,Bcloud 是一个 Linux 下超赞的客户端, 官网 github: https: ...