【css技巧】css设置文字不能被选中

ChatGPT4.0国内站点:海鲸AI

在CSS中,如果你想让文本内容不能被用户选中,可以使用user-select属性。这个属性可以控制用户是否能够选择文本。以下是如何使用这个属性的例子:

css 复制代码
.unselectable {
  -webkit-user-select: none; /* Safari 3.1+ */
  -moz-user-select: none;    /* Firefox 2+ */
  -ms-user-select: none;     /* IE 10+ */
  user-select: none;         /* 标准语法 */
}

将这个类应用到任何HTML元素上,就会阻止用户选择那个元素的文本:

html 复制代码
<p class="unselectable">这段文本不能被选中。</p>

请注意,这可能会影响用户的体验,因为它限制了用户与页面上内容交互的能力。在某些情况下,例如按钮或交互式控件上,这可能是合适的,但在其他情况下,最好允许用户选择和复制文本。

相关推荐
深圳外环高速2 分钟前
React 受控组件如何模拟用户输入
前端·react.js
土了个豆子的3 分钟前
03.缓存池
开发语言·前端·缓存·visualstudio·c#
手握风云-19 分钟前
JavaEE 进阶第四期:开启前端入门之旅(四)
前端
魔云连洲23 分钟前
React中的合成事件
前端·javascript·react.js
六月的可乐43 分钟前
【干货推荐】AI助理前端UI组件-悬浮球组件
前端·人工智能·ui
呼啦啦呼_1 小时前
Echarts自定义地图显示区域,显示街道学校等区域,对原有区域拆分
前端
浩星1 小时前
iframe引入界面有el-date-picker日期框,点击出现闪退问题处理
前端·vue.js·elementui
技术钱1 小时前
element plus 多个form校验
前端
yume_sibai1 小时前
HTML HTML基础(3)
前端·html
米花丶1 小时前
JSBridge安全通信:iOS/Android桥对象差异与最佳实践
前端·webview