CSS阻止文本选择
在日常运用中,经常遇到点击按钮/菜单的时候,选中了文本,为了避免这种情况,可以使用纯css来解决这个问题(IE10+),对于旧版本的就只能用js:onselectstart = 'return false;'这种方式。以下介绍一下-prefix-user-select:
Formal syntax: none | text | all | element
(-prefix-)user-select: none; //全部都不可选择
(-prefix-)user-select: text; //允许文本选择
(-prefix-)user-select: all; //In an HTML editor, if a double-click or context-click occurred in sub-elements, the highest ancestor with this value will be selected.
(-prefix-)user-select: element; //只有IE ff支持,无视…… 注意这属性不属于w3c标准!
目前主要使用的是none & text
假定结构如下:
<body>
<nav>
<dt>level 1</dt>
</nav>
<p>xxxxxxxxxxxxxxxxxxxx</p>
</body>
CSS如下:
body{
-webkit-user-select: none;
}
nav dt{
-webkit-user-select: text;
}
结果是:p标签的文字不能选中,dt的文字则能正常选中。
CSS阻止文本选择的更多相关文章
- 推荐20款基于 jQuery & CSS 的文本效果插件
jQuery 和 CSS 可以说是设计和开发行业的一次革命.这一切如此简单,快捷的一站式服务.jQuery 允许你在你的网页中添加一些真正令人惊叹的东西而不用付出很大的努力,要感谢那些优秀的 jQue ...
- CSS换行文本溢出显示省略号
现代浏览器中使用css可以实现文本溢出,使用 text-overflow: ellipsis;在有些场景下没有效果,这个时候你需要检查应用的场景是是否是块元素,是否有确切的width. 如果是行内元素 ...
- css构造文本
1. 1. 文本缩进text-indent:值:值为数字,最常用的数值单位是px(像素),也可以直接是百分比!text-indent:100px;text-indent:10%;2. 文本对齐text ...
- CSS控制文本超出指定宽度后用省略号代替,CSS控制文本不换行
CSS控制文本超出指定宽度后用省略号代替,CSS控制文本不换行. 一般的文字截断(适用于内联与块): .text-overflow { display:block;/*内联对象需加*/ ...
- 关于用css实现文本和图片垂直水平居中
关于用css实现文本和图片垂直水平居中 一直相信好记性不如烂笔头,最近遇到很多用到垂直居中的,整理一下以便日后查阅. 一.文本垂直水平居中 1.水平居中: 文字水平居中没什么好说的,用text-a ...
- css常用文本属性
[CSS常用文本属性] 1. 字体.字号类: ① font-weight: 字体粗细. bold-加粗.normal-正常.lighter-细体 也可以使用100-900数值,400表示normal, ...
- jq选择器(jq 与 js 互相转换),jq操作css样式 / 文本内容, jq操作类名,jq操作全局属性,jq获取盒子信息,jq获取位置信息
jq选择器(jq 与 js 互相转换) // 获取所有的页面元素jq对象 $('css3选择器语法'); var $box = $(".box:nth-child(1)"); 获取 ...
- 复习-css控制文本字体属性
css控制文本字体属性 font-family:字体系列,如”serif“”sans-serif“ font-size:尺寸 font-style:字体样式,如“normal,italic(斜体).o ...
- CSS关于文本渲染的属性text-rendering
CSS关于文本渲染的属性text-rendering告诉渲染引擎工作时如何优化显示文本. 浏览器会在渲染速度.易读性(清晰度)和几何精度方面做一个权衡. 我们知道,SVG-可缩放矢量图形(Scalab ...
随机推荐
- Python入门100例题
原文链接:http://www.cnblogs.com/CheeseZH/archive/2012/11/05/2755107.html 无论学习哪门计算机语言,只要把100例中绝大部分题目都做一遍, ...
- 转:基于开源项目OpenCV的人脸识别Demo版整理(不仅可以识别人脸,还可以识别眼睛鼻子嘴等)【模式识别中的翘楚】
文章来自于:http://blog.renren.com/share/246648717/8171467499 基于开源项目OpenCV的人脸识别Demo版整理(不仅可以识别人脸,还可以识别眼睛鼻子嘴 ...
- CentOS 6.4 编译Open vSwitch2.0
1. 安装依赖软件 yum install automake openssl-devel rpmrebuild kernel-devel make redhat-rpm-config gcc redh ...
- ural 1104 Don’t Ask Woman about Her Age
http://acm.timus.ru/problem.aspx?space=1&num=1104 #include <cstdio> #include <cstring&g ...
- B树——思路、及C语言代码的实现
0.序 本人现读本科大二,这学期学习数据结构,老师为我们的期末作业布置一道任选题,而我一直以来都有听说B树是一棵挺神奇的树,所以我选择了它,当然更重要的原因是因为B树的难度最高,我喜欢做有挑战性的工作 ...
- Qt的内存管理
在QT的程序中经常会看到只有new而不delete的情况,其实是因为QT有一套回收内存的机制,主要的规则如下: 1.所有继承自QOBJECT类的类,如果在new的时候指定了父亲,那么它的清理时在父亲被 ...
- 经常使用的自己定义UI组件- 一:TimeView
近期做蛋疼的机顶盒项目,以后遇到哪些经常使用的组件,记录于此. 反编译 youku视频TV偷来的..也希望各位童鞋多学习别人的代码,为己所用. 当然还有其它的办法,比方监听系统发出的广播等等.等 ...
- Agile 敏捷开发
简单的说,敏捷开发是一种以人为核心.迭代.循序渐进的开发方法.在敏捷开发中,软件项目的构建被切分成多个子项目,各个子项目的成果都经过测试,具备集成和可运行的特征.换言之,就是把一个大项目分为多个相互联 ...
- 手机软件记事本(SuperNotepad)的使用教程
软件简介: 手机应用记事本(SuperNotepad)类似电脑应用notepad, 可用于文本阅读和编辑新建电子书(本应用限文本txt文件),是阅读小说和便签记录的好帮手. 电子书阅读器及便签的手机应 ...
- passwd的使用
名称:passwd 使用权限:所有使用者 使用方式:passwd [-k] [-l] [-u [-f]] [-d] [-S] [username] 说明:用来更改使用者的密码 参数: -k keep ...