html - 防止元素参与文本选择

Question

我在 <pre><code> 中有一些源代码行号在单独的 <div> 中.选择文本时，行号会随之而来，随后会被复制。有什么方法可以防止行号成为选择的一部分，即使我选择了源代码块上方和下方的元素？

为了浏览时关闭它的人的利益，我想避免使用 JavaScript。 (使用 JavaScript，我会添加一个按钮来隐藏行号)。

unselectable="on"以及各种特定于供应商的 user-select CSS 属性不起作用；数字仍然被选中和复制。

Answer 1

给你想要阻止选择 id 的元素。

然后将其放入您的 CSS 中:

#id-name {
   -webkit-touch-callout: none;
   -webkit-user-select: none;
   -khtml-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
   user-select: none;
}
::-moz-selection {
   background: transparent;
}
::selection { 
   background: transparent; 
}