看看这个片段：
.noselect {
-webkit-touch-callout: none; /* iOS Safari */
-webkit-user-select: none; /* Safari */
-khtml-user-select: none; /* Konqueror HTML */
-moz-user-select: none; /* Firefox */
-ms-user-select: none; /* Internet Explorer/Edge */
user-select: none; /* Non-prefixed version, currently
supported by Chrome and Opera */
}
<p>
Selectable text.
</p>
<p class="noselect">
Unselectable text.
</p>
<p>
Selectable text.
</p>
现在双击第一行然后复制。将其粘贴到任何地方，您将能够看到“不可选择的文本”。也会被复制。这种情况仅发生在 Chrome 上。有谁知道为什么会发生这种情况以及有什么方法可以解决它？
这应该在最新的 chrome 中修复，但为了以防万一，您可以使用伪元素添加绝对无法在任何浏览器中选择或复制的文本（即代码列表中的行号）。这是将其用于动态内容的技巧：
.line::before {
content: attr(data-line-number);
margin-right: 8px;
}
<div><span class="line" data-line-number="1"></span>line 1</div>
<div><span class="line" data-line-number="2"></span>line 2</div>
<div><span class="line" data-line-number="3"></span>line 3</div>
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
