Предотвращение превращения тегов <span>во вкладки при выделении текста - PullRequest
0 голосов
/ 31 августа 2018

Итак, у меня есть старый сайт, который широко использует 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, поэтому я не могу заменить эти <span> другие теги HTML.
Кроме того, я не могу использовать Javascript для таких вещей, как «преобразование» ячеек во входные данные, когда пользователь нажимает на них, чтобы он мог точно выбрать текст. На всякий случай кто-то подумает об этом решении (что было бы круто, но я не могу этого сделать).

Редактировать : ну ладно, я нашел разумное решение вскоре после публикации вопроса (резиновый утки работал с задержкой ...). Решение заключается в добавлении отступа в ячейку таблицы. И символ табуляции даже не имеет ничего общего с <span>. Появляется, когда ваш выбор переходит в другую ячейку.
Но все же, я хотел бы знать, есть ли способ удалить этот вид пробелов с помощью css.

1 Ответ

0 голосов
/ 31 августа 2018

вы можете попробовать

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 .....

...