user-select
CSS 属性 user-select 控制用户能否选中文本。除了文本框内,它对被载入为 chrome 的内容没有影响。
用途
页面中点击两下会导致内容选中,可以通过这个属性进行限制
语法
none
元素及其子元素的文本不可选中。请注意这个Selection 对象可以包含这些元素。从 Firefox 21 开始, none 表现的像 -moz-none,因此可以使用 -moz-user-select: text 在元素上重新启用选择。
text
用户可以选择文本。
all
在一个 HTML 编辑器中,当双击子元素或者上下文时,那么包含该子元素的最顶层元素也会被选中。
contain
允许在元素内选择;但是,选区将被限制在该元素的边界之内
auto(默认值)
auto 的具体取值取决于一系列条件,具体如下:
- 在 ::before 和 ::after 伪元素上,采用的属性值是 none
- 如果元素是可编辑元素,则采用的属性值是 contain
- 否则,如果此元素的父元素的 user-select 采用的属性值为 all,则该元素采用的属性值也为 all
- 否则,如果此元素的父元素的 user-select 采用的属性值为 none,则该元素采用的属性值也为 none
- 否则,采用的属性值为 text
示例
HTML
1 | <p>你应该可以自由选中这段文本中的一段(我是默认值)。</p> |
CSS
1 | .unselectable { |