html - 用户选择：无导致 Safari 上无法访问输入字段

Question

使用这些 css 样式，我可以防止页面上突出显示的文本选择。但这会导致输入字段被 Safari 上的用户输入锁定。

* {
-webkit-touch-callout: none;
-webkit-user-select: none; // locks fields on Safari
-khtml-user-select: none; // locks fields on Safari
-moz-user-select: none;
-ms-user-select: none;
user-select: none;      
}

Safari 有没有办法在不干扰输入字段的情况下防止用户选择？

Answer 1

为什么不将样式应用于除输入之外的所有内容？

css3方式： *:not(input){...}

Answer 2

没什么新鲜的 ：）

*:not(input, textarea){
    -webkit-touch-callout: none;
    -webkit-user-select: none; // locks fields on Safari
    -khtml-user-select: none; // locks fields on Safari
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

Answer 3

对于 css 中的每种情况：

*:not(input), *:focus: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;
  outline-style:none;/*IE*/
}

Answer 4

我需要一些更精确的东西。

input[type=text] 
{
  -webkit-user-select: text;
}

input[type=password]
{
  -webkit-user-select: all;
}