防止元素参与文本选择

【问题标题】：Prevent element from taking part in text selection防止元素参与文本选择
【发布时间】：2013-02-15 14:38:59
【问题描述】：

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

我想避免使用 JavaScript，以使不使用 JavaScript 浏览的人受益。（使用 JavaScript，我会添加一个按钮来隐藏行号）。

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

【问题讨论】：

标签： html css textselection

【解决方案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; 
}

【讨论】：

啊啊啊。我现在知道了。该元素似乎仍被选中（我使用的是 Firefox），但实际上并未选择文本，也没有复制任何内容。为了禁用选择外观，我在元素上添加了::-moz-selection { background: transparent; } 和::selection { background: transparent; }。
您能否将::selection 位添加到您的答案中？（如果你不介意的话）
@nneonneo：如果这解决了您的问题，请将其标记为答案。谢谢。