H5_0026:使用CSS里的user-select属性控制用户在页面上选中的内容
CSS里的user-select属性用来禁止用户用鼠标在页面上选中文字、图片等,也就是,让页面内容不可选。也可以只允许用户选中文字,或者全部都放开,用户可以同时选中文字、还包括文本里的图片、视频等其它东西。user-select属性的作用是元素级别的,它不仅可以作用整个页面,也可以只在指定的元素和其子元素上生效。
写这篇文章的时候,“user-select”属性在各大浏览器里都还是实验性的属性,以后有可能废弃,也有可能转正,目前使用各种浏览器引擎前缀,它的作用还是能发挥的不错的。
我们来先看看user-select属性的语法:
- user-select: none;
- user-select: auto;
- user-select: text;
- user-select: contain;
- user-select: all;
- //火狐浏览器
- -moz-user-select: none;
- -moz-user-select: text;
- -moz-user-select: all;
- //谷歌浏览器
- -webkit-user-select: none;
- -webkit-user-select: text;
- -webkit-user-select: all;
- //IE
- -ms-user-select: none;
- -ms-user-select: text;
- -ms-user-select: all;
- -ms-user-select: element;
下面是“user-select”属性的属性值介绍:
none- 禁止用户选中
text- 对用户的选择没有限制
all- 目标元素将整体被选中,也就是说不能只选中一部分,在你用鼠标选中部分文字时,浏览器会自动选中整个元素里的内容。(谷歌浏览器里好像不太灵?)
H5_0026:使用CSS里的user-select属性控制用户在页面上选中的内容的更多相关文章
- 使用CSS里的user-select属性控制用户在页面上选中的内容
CSS里的user-select属性用来禁止用户用鼠标在页面上选中文字.图片等,也就是,让页面内容不可选.也可以只允许用户选中文字,或者全部都放开,用户可以同时选中文字.还包括文本里的图片.视频等其它 ...
- iOS - 使用WKWebView时OC调JS的user-select属性控制用户操作
// 页面加载完成之后调用 - (void)webView:(WKWebView *)webView didFinishNavigation:(null_unspecified WKNavigatio ...
- CSS里一个奇怪的属性
事情是这样的,在一个手机界面的制作中,我发现按钮点击后总会出现一个边框,于是开始搜索解决方案.搜到的解决方案是这样的. a:focus,input:focus{ -webkit-tap-highlig ...
- MVC dropdownlist 后端设置select属性后前端依然不能默认选中的解决方法
-----------------------------------来自网上的解决方法--------------------------------------------- ASP.Net MV ...
- canvas里设置width和css里设置width和js里设置width的区别
canvas.width 和 它的style.width是不一样的: canvas是个画布,有他自己的宽和高(默认是没有单位的纯数字),就是canvas.width和canvas.height的宽和高 ...
- Jquery循环select标签,并给指定option添加select属性后在页面上不显示的问题
<select id="testId"> <option value="">--请选择--</option> <opt ...
- css,js,jquery的载入方式和属性控制
本文章主要总结了css,js,jQuery在编写程序时的载入方式,与属性控制方式html和css共同组成了一个最基础的网页,js为标签样式提供动态效果 一,css的载入方式与属性控制 1.1,css引 ...
- CSS里的pointer-events属性
现代浏览器里CSS的职责范围和JavaScript的越来越模糊分不清.比如CSS里-webkit-touch-callout属性在iOS里能禁止当用户点击时弹出气泡框.而本文要说的pointer-ev ...
- css常见的易混淆属性和值的区别(一)
css的属性很多,每一个属性的值也很多,组合起来便有成千上万种.不同属性之间的相互组合也可以产生不同的样式,css真是一种优美的样式设计语言.下面对工作中常见的易混淆的属性和值进行总结: 1. lin ...
随机推荐
- 应用层vc实现三种文件监视方法
http://hi.baidu.com/sadusaga/item/daa0d4b764c6dd76254b09cc http://bbs.csdn.net/topics/280032788 http ...
- python UnicodeDecodeError: 'gbk' codec can't decode byte 0x99 in position 87: illegal multibyte sequence异常解决
我们处理文本文件时,经常会遇到这样的报错: UnicodeDecodeError: 'gbk' codec can't decode byte 0x99 in position 87: illegal ...
- Centos 7 x64 系统初始化
前言 Hi,小伙伴们,系统初始化是运维工作中重要的一环,它能有效的提升工作效率,并且是标准化规范化的前提:它能省去要用时再去下载的麻烦,另外,还可以避免因未初始化引起的一些故障问题,可谓好处多多.系统 ...
- Yandex Big Data Essentials Week1 Unix Command Line Interface File Content exploration
cat displays the contents of a file at the command line copies or apppend text file into a document ...
- 基于python的密码字典生成器
最近在网上看到一些作品,然后对其进行了一些完善.只是用于学习,不要去干坏事哦.程序来源于网络,我只是做了一些优化. #!/usr/bin/python# -*- coding:utf-8 -*-# @ ...
- 数据算法 --hadoop/spark数据处理技巧 --(5.移动平均 6. 数据挖掘之购物篮分析MBA)
五.移动平均 多个连续周期的时间序列数据平均值(按相同时间间隔得到的观察值,如每小时一次或每天一次)称为移动平均.之所以称之为移动,是因为随着新的时间序列数据的到来,要不断重新计算这个平均值,由于会删 ...
- 根据map中的某一key进行排序(快速排序实现)
/** * @author Gaoxl * 根据key值排序,要求key值能够转为Long类型(快速排序) * @param maps * @param key * @return */ public ...
- Vue之Vuex的使用
重点看懂这张图: 重点记住: 1.Mutation 必须是同步函数,即mutations里只能处理同步操作. 2.如果处理的是同步操作可直接commit提交mutations更改state,如果是异步 ...
- Python字符串字母大小写变换
说明: 字符串就是一系列字符,在Python中用引号括起来的都是字符串,引号可以是单引号,也可以是双引号,比如:“This is a book.” ‘This is an apple.’ 接下来简单 ...
- C语言基础五 数组的应用
.根据用户输入的10人成绩并将其保存到数组中,求最高成绩,最低成绩和平均成绩 int scoure[10];//存储10个数据的数组 int i; int sum;//总成绩 int max,min, ...