Сохранение наследуемого фона в CSS :: selection - PullRequest
0 голосов
/ 08 января 2019

Согласно этому ответу, цвета выбора веб-страниц зависят от комбинации операционной системы / браузера. Я хотел бы изменить цвет переднего плана :: selection, но не фон; однако, кажется, что изменение первого делает последнее невидимым.

///703556/vydelenie-teksta-v-elemente-srodni-vydeleniy-myshy
function selectText(node) {
  node = document.getElementById(node);

  if (document.body.createTextRange) {
    const range = document.body.createTextRange();
    range.moveToElementText(node);
    range.select();
  } else if (window.getSelection) {
    const selection = window.getSelection();
    const range = document.createRange();
    range.selectNodeContents(node);
    selection.removeAllRanges();
    selection.addRange(range);
  }
}
#changed::selection {
  color: red;
}

button,
p {
  display: inline;
}
<button onclick="selectText('normal')">Select</button>&nbsp;
<p id="normal">This text maintains the standard highlight color, which I want to maintain.</p>
<br>
<button onclick="selectText('changed')">Select</button>&nbsp;
<p id="changed">When I try to change the foreground color of the selection, the background color is unset.</p>
...