Хромированный символ, который невидим, но доступен для поиска

Question

Я работаю в исследовательском проекте, и у нас есть скрипт python, который генерирует html-тексты, в которых выделено несколько слов. Я хотел бы сделать положение этих выделенных слов в текстах, видимых на полосе прокрутки. Один из способов сделать это - добавить специальный символ (например, «$») после каждого из отмеченных слов, а затем выполнить поиск по этому символу.

Мы хотели бы, чтобы этот персонаж был невидим, чтобы визуально не испортить текст.

Я пробовал сделать класс span с именем «скрытый» с размером шрифта 0. Это делает работу со скрытием знака $, но поиск Chrome внезапно не указывает местоположение на полосе прокрутки. В поле поиска по-прежнему отображается 57 результатов для «$», но подсветка полосы прокрутки исчезла, и нажатие кнопок «вверх» и «вниз» не приводит меня к месту следующего результата.

Я также попытался вставить в текст невидимые запятые (ampersandic;), но не удалось их найти.

Другие решения, любой?

Большое спасибо!

Answer 1

Вы можете использовать opacity: 0, который визуально скроет элемент, но не удалит пространство символа.
Чтобы свести к минимуму пространство, вы можете уменьшить размер шрифта до минимума, как font-size: 1px