必须全选

我怀疑 CSS 可以控制文本选择方式这一点并不广为人知。您可以使用 user-select: none; 来阻止选择某些文本。这在一般情况下可能不是很好的 UX，但也许您使用了一些句点 (.) 字符作为装饰或其他用途，我可以理解阻止选择它们的需求。

完全相反的是 user-select: all;，它强制选择元素中的所有文本。同样，这可能也是一个有点糟糕的 UX。在网页上强制用户选择所有文本的情况非常少见，而主动阻止用户选择其中一部分文本则让人感觉像是试图过度提供帮助，最终反而造成了损害。

无论如何，这里有 Dag Frode Solberg 提供的更多详细信息。

我在此处分叉了他的演示，以展示一个简单的场景，其中点击选择可能具有一定的意义

查看 CodePen 上的示例
css/user-select/4，作者是 Chris Coyier (@chriscoyier)
在 CodePen 上。

如果您想实现一种点击一次突出显示所有内容然后停止干扰的情况，您可以在 JavaScript 中使用点击处理程序来实现，该处理程序在第一次点击后自行移除。

const cells = document.querySelectorAll("td");

function highlight(event) {
  window.getSelection()
    .selectAllChildren(
      event.target
    );
  event.target.removeEventListener("click", highlight);
}

cells.forEach(cell => {
  cell.addEventListener("click", highlight);
});

直接链接 →