user-select属性

于 2023-02-28 19:51:04 发布
阅读量349 收藏
点赞数
分类专栏： 前端 文章标签： css 前端 html
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_57102338/article/details/129268548
版权
在样式开发中，user-select属性用于控制元素是否可被用户选中。它可以设置为all,auto,contain,none,text,inherit,initial,或revert，每种设置都有不同的效果，例如none使元素和其子元素不可选中，而text则允许选中文本。默认行为由浏览器决定，可以通过继承父元素属性或设定默认样式来调整。
摘要由CSDN通过智能技术生成

作用:在样式开发中，有可被选中， 和不可被用户选中的元素，这里需要用到user-select

  • all 当所有内容作为一个整体时可以被选择。如果双击或者在上下文上点击子元素，那么被选择的部分将是以该子元素向上回溯的最高祖先元素
  • auto 文本将根据浏览器的默认属性进行选择
  • contain 选择该元素范围内的文本，只支持(Explorer未测试)
  • none 元素和子元素的文本将无法被选中
  • text 文本可以被选中
  • inherit 继承父元素的此属性
  • initial 设置为初始的样式属性
  • revert 样式表中定义的元素属性的默认值。若用户定义样式表中显式设置，则按用户定义的设置否则，按照浏览器默认的的样式设置在否则，等价于unset
  • unset 如果该属性可以被继承，则是继承的值，不可以被继承(initial),则是默认的值
绿末
关注
专栏目录
将用户的选择控制在你的手中-user-select
专注于图像领域，主要研究内容包括计算机视觉和深度学习，特别是在图像分类、目标检测和图像生成等方面有深入的研究和实践经验。
12-07 1413
在敲打自己的个人博客时，在博客的详情页，对于不同的内容，我是想有不同的复制方式的。例如代码块我就想读者单击就可以复制，这样方便读者本地调试，而对于文字描述部分，希望可以不允许读者复制。作为一个坚定的能用CSS绝不上JS的极端份子，我最终找到了CSS3中的user-select。
CSS禁止文字选择user-select应用
09-25
CSS中的`user-select`属性就是为了解决这个问题而诞生的。该属性允许开发者控制用户是否可以选中文本，这对于一些交互设计或者特定UI元素的实现非常有用。 `user-select`属性的两个主要值是`none`和`text`。当设置...
user-select介绍
精彩人生
01-31 809
来源：http://www.qianduan.net/introduce-user-select.html 这是在css3 UI规范中新增的一个功能，用来控制内容的可选择性。 用法： 1 user-select:value; 值： auto——默认值，用户可以选中元素中的内容 none——用户不能选择元素中的任何内容 t
SQL(use_select)
weixin_34273095的博客
02-09 195
C:\ProgramData\MySQL\MySQL Server 5.5\data UPDATE: 修改 *修改数据库的字符集 *alter database 数据库名称 alter database db6 character set utf8; show create database db6; 删除数据库 drop database 数据库名称； 判断数据库存在，存在再删除 drop database if exists 数据库名称； show database if exists db3; 使
user-select的详细用法
热门推荐
捷搜索
10-31 1万+
前言 做网页的时候，有些文字我们需要能被选中，有些我们不要能被选中，那么这就需要用到一个css属性了，那就是 user-select  使用方法 user-select: none|auto|text|contain|all; /*firefox浏览器*/ -moz-user-select: none|text|all; /*safari、chrome浏览器*/ -webkit-use...
CSS3的user-select属性，用来指定文本的可选择性
木雷双雄7
03-16 945
user-select是css3新增的一个属性,用来指定文本的可选择性。 1、取值 none：文本不能被选择。 text：可以选择文本。 all：当所有内容作为一个整体时可以被选择。如果双击或者在上下文上点击子元素，那么被选择的部分将是以该子元素向上回溯的最高祖先元素。 element：可以选择文本，但选择范围受元素边界的约束。 2、说明 IE6-9不支持
css 让文字不被选中之-moz-user-select 属性介绍
01-21
而在firefox下，文字不会被选中，查看google calender的css，原来还有-moz-user-select这个属性，很好玩！ 最后采用一个了js方法，即onselectstart=function{return false;}，不让页面进行选择，呵呵，这是很多网站...
-moz-user-select与onselectstart 禁止选择文字的方法
09-25
本文将详细介绍如何使用`-moz-user-select`和`onselectstart`属性来禁止文本选择，并讨论它们在不同浏览器中的兼容性和应用。 `-moz-user-select`是Mozilla Firefox浏览器特有的CSS属性，用于控制元素是否允许用户...
css3:user-select属性
weixin_30314631的博客
09-30 210
一、user-select简介 这是在css3 UI规范中新增的一个功能，用来控制内容的可选择性 二、user-select:值 auto——默认值，用户可以选中元素中的内容 none——用户不能选择元素中的任何内容 text——用户可以选择元素中的文本 element——文本可选，但仅限元素的边界内(只有IE和FF支持) all——在编辑器内，如果双击/上下文点击发生在子...
css3中user-select的用法详解
weixin_34318326的博客
12-19 462
css3中user-select的用法详解 user-select属性是css3新增的属性，用于设置用户是否能够选中文本。可用于除替换元素外的所有元素，以下是user-select的主要用法和注意事项的说明，更多信息可参考如下css3文档说明。 参考链接：http://www.css88.com/book/css/properties/...
user-select的使用
zlq_CSDN的博客
03-31 2594
之前在我编写音乐官网的时候，涉及到关于歌曲名称复制的问题，这个时候可能不让复制更符合常理，因此我们可以用到user-select来进行设置。具体用法如下： 语法：user-select：none |text| all | element默认值：text适用于：除替换元素外的所有元素继承性：无动画性：否计算值：指定值取值：none：文本不能被选择text：可以选择文本all：当所有内容作为一个整体时...
user-select的用法
05-31 4729
前几天在网页制作中，发现有些地方的文字双击就会被选中，特别丑，一点也不美观，并且有些部分的需求就是文字不可以被选中或复制，在这种情况下，我们就可以用到 user-select 了
css3的常用小东西
不确定因素的博客
12-27 444
为什么整理 总结内容 1.如何修改点击手势 div{ //1.1点击手势 cursor: pointer; //1.2带指针手势 cursor:alias; //1.3带问号手势 cursor: help; //1.4加载手势 cursor:progress; } 2.如何画一个三角形 //正、倒三角 div { margin-top: 100px; width: 10px; height: 10px; border: 50px solid transparent; /
css属性
m0_45144737的博客
12-23 1637
一些css好用属性
CSS user-select属性拾遗
weixin_30512785的博客
02-28 89
昨天把Notebook整理了一下，去查了一下手册，原来之前比较忽略user-select这个属性，因为之前以为只有webkit才支持的。手册进行了补充： user-select禁止用户选中文字 none：文本不能被选择text：可以选择文本all：当所有内容作为一个整体时可以被选择。如果双击或者在上下文上点击子元素，那么被选择的部分将是以该子元素向上回溯的最高祖先元素。eleme...
CSS设置页面文字不能被选中(兼容各种浏览器)
贾世鑫的博客
07-31 2420
示例代码： <p>你应该可以选中这段文本。</p> <p class="unselectable">嗨，你不能选中这段文本!</p> css代码： .unselectable { -moz-user-select: none; -webkit-user-select: none; -ms-user-select: none; ...
前端禁止复制页面上的文字内容
博哥的二进制世界
11-30 1865
前端禁止复制页面上的文字内容
user-select用法
迪迦 • 奥特曼
08-14 949
前言 做网页的时候，有些文字我们需要能被选中，有些我们不要能被选中，那么这就需要用到一个css属性了，那就是 user-select 使用方法 user-select: none|auto|text|contain|all; /*firefox浏览器*/ -moz-user-select: none|text|all; /*safari、chrome浏览器*/ -webkit-user-select: none|text|all; /*Safari中不支持该属性值，只能使用none或者text，或者
user-select
最新发布
05-18
user-select是CSS属性，用于控制用户是否可以选择文本内容。它有三个取值：auto表示用户可以选择文本，none表示用户无法选择文本，text表示只有在文本输入框或类似的区域内可以选择文本。例如，以下CSS代码禁止了网页中所有元素的文本选择功能： ``` * { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } ```
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值