选择文本时防止标记成为标签

Question

所以，我有一个广泛使用html表的旧网站。 在表格单元格中，通常有一个<span>标签，上面有一些属性。我无法改变那些表的结构。 当有人想要选择单元格中的所有文本时，如果他们不确定只选择可见字符，则包含该文本的<span>标记将转换为制表符。因此，如果他们将文本粘贴到某个地方，它将以标签开头。

例：

table {
  margin-left: 230px;
  margin-top: 10px;
  border: 1px solid black;
}
td {
  padding: 5px;
  border: 1px solid black;
}
p, textarea {
  margin-left: 50px;
  width: 500px;
  min-height: 20px;
}

<table><!-- (comments to remove whitespace between tags)
  --><tbody><!--
    --><tr><!--
      --><td><span>first cell</span></td><!--
      --><td><span>hi there</span></td><!--
    --></tr><!--
  --></tbody><!--
--></table>
<p>Select "hi there" from the end to the begginning, by going past it, and paste it below, you will see a tab character at the beginning.<br>
(There can also be a new-line character before "first cell")</p>
<textarea></textarea>

基本上我想要的是实际被复制的文本正是视觉上突出显示的文本。至少如果选择在单个单元格内。 用css可以做到这一点吗？

同样，我不能改变HTML结构，只能改变css，所以我无法用其他一些HTML标签替换那些<span>s。 此外，当用户点击它们时，我无法使用Javascript来执行诸如将单元格“转换”为输入的内容，以便他可以精确地选择文本。以防万一有人会考虑这个解决方案（这会很酷，但我不能这样做）。

编辑：welp我在发布问题后不久找到了一个合理的解决方案（橡胶避震工作有延迟......）。解决方案是在表格单元格中添加填充。标签字符甚至与<span>没有任何关系。当您的选择进入另一个单元格时出现。 但是，我仍然想知道是否有任何方法可以用css删除这种空格。

Answer 1

你可以试试

html{ 
    -o-user-select: none;
    -moz-user-select: none;
    -webkit-user-select: none;
    user-select: none; 
}
span,p,textarea,div,br,td{
    -o-user-select: text;
    -moz-user-select: text;
    -webkit-user-select: text;
    user-select: text;
}

你可以在span，p，div .....列表中添加更多标签名称.....