close
轉自 https://developer.mozilla.org/zh-CN/docs/Web/CSS/user-select
--
user-select CSS属性，控制着用户能否选中文本。除了在文本框里，它在chrome浏览器中对已加载的文本没有影响。
/* Keyword values */
user-select: none;
user-select: auto;
user-select: text;
user-select: contain;
user-select: all;
/* Global values */
user-select: inherit;
user-select: initial;
user-select: unset;
/* Mozilla-specific values */
-moz-user-select: none;
-moz-user-select: text;
-moz-user-select: all;
/* WebKit-specific values */
-webkit-user-select: none;
-webkit-user-select: text;
-webkit-user-select: all; /* Doesn't work in Safari; use only
"none" or "text", or else it will
allow typing in the <html> container */
/* Microsoft-specific values */
-ms-user-select: none;
-ms-user-select: text;
-ms-user-select: element;Syntax
none- 元素及其子元素的文本不可选中。 请注意这个
Selection对象可以包含这些元素。 从Firefox 21开始，none表现的像-moz-none，因此可以使用-moz-user-select: text在子元素上重新启用选择。 auto-
auto的计算值确定如下：
- 在
::before和::after伪元素上，计算属性是none - 如果元素是可编辑元素，则计算值是
contain - 否则，如果此元素的父元素的
user-select的计算值为all, 计算值则为all - 否则，如果此元素的父级上的
user-select的计算值为none, 计算值则为none - 否则，计算值则为
text
- 在
text- 用户可以选择文本。
-moz-none- 元素和子元素的文本将显示为无法选择它们。 请注意，
Selection对象可以包含这些元素。 可以使用-moz-user-select: text. 在子元素上重新启用选择。 从Firefox 21开始，none表现得像-moz-none. all- 在一个HTML编辑器中，当双击子元素或者上下文时，那么包含该子元素的最顶层元素也会被选中。
containelement(IE-specific alias)- 允许选择在元素内开始; 但是，选择将包含在该元素的边界内。 仅在Internet Explorer中受支持。
auto | text | none | contain | all
Example
HTML
<p>你应该可以选中这段文本。</p>
<p class="unselectable">嗨，你不能选中这段文本!</p>CSS
.unselectable {
-moz-user-select: none;
-webkit-user-select: none;
-ms-user-select: none;
user-select: none;
}Specifications
| Specification | Status | Comment |
|---|---|---|
| CSS Basic User Interface Module Level 4 user-select |
Working Draft | 初始值。也可以定义 -webkit-user-select 作为一个不推荐使用的别名 user-select. |
Browser compatibility
Update compatibility data on GitHub
| 54 | 12 | Yes | 10 | 15 | 3.1 | 54 | 54 | 12 | Yes | 14 | 3.2 | 6.0 |
| Yes | 12 | Yes | 10 | Yes | Yes | Yes | Yes | 12 | Yes | Yes | Yes | Yes |
| Yes | 12 | Yes | 10 | Yes | Yes | Yes | Yes | 12 | Yes | Yes | Yes | Yes |
| Yes | 12 | 21 | 10 | Yes | Yes | Yes | Yes | 12 | 21 | Yes | Yes | Yes |
| Yes | 12 | Yes | 10 | Yes | Partial | Yes | Yes | 12 | Yes | Yes | Partial | Yes |
| No | 12 | No | Yes | No | No | No | No | 12 | No | No | No | No |
Legend
- Full support
- Partial support
- No support
- Experimental. Expect behavior to change in the future.
- See implementation notes.
- User must explicitly enable this feature.
- Uses a non-standard name.
- Requires a vendor prefix or different name for use.
See also
--
全站熱搜
留言列表
AI 
