2

因此，以下内容适用于 Chrome，但不适用于 FireFox：

* {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

input {
    -webkit-touch-callout: auto;
    -webkit-user-select: auto;
    -khtml-user-select: auto;
    -moz-user-select: auto;
    -ms-user-select: auto;
    user-select: auto;
}

有没有办法禁用对容器元素的选择，但允许选择表单输入等内容？

4

1 回答 1

1

一些建议（尝试有创意）

1.试着简单地写：

:not(input) {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

此规则应适用于除 之外的所有内容input，因此不需要另一条恢复输入行为的规则（可能在某些 FF 版本上失败？）

2.如果这不能解决，请尝试-moz-selection/selection在用户选择时使用具有透明背景的伪类作弊

::-moz-selection { background: transparent; color: #000; }
::selection      { background: transparent; color: #000; } 

input::-moz-selection { background: blue; color: #fff; }
input::selection      { background: blue; color: #fff; }

作为可用性的旁注，请避免这种限制：它们通常很烦人，如果有人想真正选择和复制页面上的文本，他可以从源代码视图轻松完成

于 2012-04-23T13:31:45.380 回答