css取消双击选中文字
在我们在写前端页面的时候,由于手速过快(当然这都是指的老司机),会经常双击,浏览器就会默认选中你双击的文本,这种感觉有点不太好。
这个时候就用到了 user-select:none; 属性。
因为存在着兼容性的问题,所以在写的时候就需要考虑一下了。
div{
-moz-user-select:none;/*火狐*/
-webkit-user-select:none;/*webkit浏览器*/
-ms-user-select:none;/*IE10*/
-khtml-user-select:none;/*早期浏览器*/
user-select:none;
}
这样这个区域的文字就不会被选中了。
还有种方法就是在相应的元素上添加 onselectstart="return false;"
<section onselectstart="return false;">这又是一段文字</section>
这样也是可以实现不被选中的效果。
如果把上述的方法写到body中,就实现了禁止用户选中页面上内容的效果。
*在网页上选择文本的功能在许多用户方案中非常重要,假如是一个新闻页面,新闻的内容是可以被选中的,但是页面还可能包含用户不需要或不希望选择的菜单,广告和指向站点、等。所以使用的时候还是看需求了。
css取消双击选中文字的更多相关文章
- css禁止鼠标双击选中文字
div{ -moz-user-select:none;/*火狐*/ -webkit-user-select:none;/*webkit浏览器*/ -ms-user-select:none;/*IE10 ...
- 用css改变鼠标选中文字的样式
打开一个页面,选中一段文字,会出现系统默认的蓝色背景和白色文字,如下图: 那么 这种选中效果我们怎么去自定制呢,比如我想让文字选中的时候背景是绿色,文字是白色 我们在css文件中插入如下代码: ::- ...
- 【React踩坑记一】React项目中禁用浏览器双击选中文字的功能
常规项目,我们只需要给标签加一个onselectstart事件,return false就可以 例: <div onselectstart="return false;" & ...
- CSS阻止页面双击选中文本
转载自:w3cui 在双击左右箭头,快速切换图片滚动时,会选择附近区域的文字,感觉不是很好,今天在同事在分享时,讲到了这个问题, 试了一下,不错,解决了问题IE及Chrome下的方法一样,对相应的元素 ...
- hexo中加入点击出现小红心的特效会导致无法双击选中和连续点击三次选中一整行的操作
文章目录 问题描述 解决 个人博客:https://mmmmmm.me 源码:https://github.com/dataiyangu/dataiyangu.github.io 问题描述 如题,我们 ...
- CSS3禁止用户选中文字——user-select: none;
需求:现在有一个需求是在移动端让你禁止用户选中文字,你会怎么做呢?如下图 解决方法:使用CSS3新增属性 user-select: none; -webkit-user-select:non ...
- 不同CSS布局实现与文字鼠标选择的可用性——张鑫旭
by zhangxinxu from http://www.zhangxinxu.com本文地址:http://www.zhangxinxu.com/wordpress/?p=2401 一.文字选择的 ...
- Windows 10设置桌面图标间距、窗口的背景颜色、选中文字的背景颜色
Windows 10取消了“高级外观设置”(或者叫“窗口颜色和外观”设置),想调整一些参数只能进注册表了. 修改后可能需要注销或重启才能生效. 按Win+R,然后输入regedit进入注册表编辑器. ...
- macOS Sierra 触控板无法三指拖移窗口、三指选中文字的解决方法
问题:升级macOS Sierra新系统后,发现触摸板无法进行三指拖移窗口.三指选定文字的操作.在“系统偏好设置”——“触控板”内无法进行设置. 解决:“系统偏好设置”——“辅助功能”——“鼠标与触控 ...
随机推荐
- 题目1004:Median(查找中位数)
问题来源 http://ac.jobdu.com/problem.php?pid=1004 问题描述 给你两个非降序序列,让你求中位数.中位数为第(n+1)/2个数(从0开始计算). 问题分析 这个问 ...
- appium+python 存在多个类时,不用每次都初始化解决办法
appium+python写自动化测试用例时,为了代码的可维护性,分成不同的类是很常见的办法, 但是在运行时,每一个类都要初始化一次,即每次都会重启应用,这很麻烦,通过__new__可进行多个类之间的 ...
- UNIX基础概念
UNIX基本概念 进程 从用户观点来看:进程是程序的一个执行实例. 从UNIX系统内部来看,是为运行程序提供执行环境的实体,是系统进行资源分配和调度运行的一个单位. 进程有三个特点: 1)进程有一个控 ...
- Mac 10.12安装WebStorm
下载: (链接: https://pan.baidu.com/s/1c2o8wUG 密码: 2waz)
- Jexus进程守护工具jws.guard
一个运行中的进程,难免会因为各种各样的原因无缘无故的宕掉(比如网站瞬间的负载过高.内存不足等),而Jexus宕掉的后果往往只有一个:对外提供服务的网站无法访问了.因此,我们需要最大限度的保障我们的网站 ...
- (转)史上最全的MSSQL复习笔记
1.什么是SQL语句 sql语言:结构化的查询语言.(Structured Query Language),是关系数据库管理系统的标准语言. 它是一种解释语言:写一句执行一句,不需要整体编译执行.语法 ...
- 什么是Java代码的编译与反编译?(转)
转自:http://java.tedu.cn/ask/203119.html Java代码的编译与反编译 一.什么是编译 1.利用编译程序从源语言编写的源程序产生目标程序的过程. 2.用编译程序产生目 ...
- ubuntu 16.04安装好后没声音的解决方法
刚安装好Ubuntu16.04 后没声音,找了好多方法都不行,看到网上说通过安装pavucontrol和alsamixer调节解决,最后无意发现一个方法,总算是可以用了,在此记录一下.可能有的可以解决 ...
- CPU缓存一致性协议与java中的volatile关键字
有关缓存一致性协议MESI自行百度. 提出问题:volatile在缓存一致性协议上又做了哪些事情?为啥它不保证原子性? 在缓存一致性协议下,CPU为了执行效率使用了写(存储)缓存和失效队列从而导致对用 ...
- Netty(1):第一个netty程序
为什么选择Netty netty是业界最流行的NIO框架之一,它的健壮型,功能,性能,可定制性和可扩展性都是首屈一指的,Hadoop的RPC框架Avro就使用了netty作为底层的通信框架,此外net ...