Question

我想禁用为用户无法编辑的所有元素选择文本，例如文本或图像，但我仍然希望将其保留在您可以输入的元素中，例如输入或textareas。

要禁用文本选择，请使用以下命令：

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

但正如我所说，这会影响所有元素，所以我尝试使用这个选择器：

*[contenteditable=false]

而不只是*

但是由于某些原因这显然不起作用，CSS中是否有任何选择器来检测内容可编辑的元素？

Answer 1

您使用的是attribute selector，会在contenteditable attribute出现时选择。

您实际需要的是不选择接受输入的元素的方法，因为没有共享选择器。您必须使用:not并列出所有此类标记（并且可能包含contenteditable属性选择器）。

*:not(input):not(textarea):not([contenteditable=""]):not([contenteditable="true"]) {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

<input value="input" />
<hr />
<textarea>textarea</textarea>
<hr />
<p>paragraph</p>
<hr />
<p contenteditable>paragraph editable</p>

内容可编辑选择器？

1 个答案: