Как предотвратить затемнение в перекрывающихся высотах строк в выделенном тексте

Question

Если текст имеет небольшую высоту строки, есть ли способ контролировать непрозрачность, чтобы он не затемнялся там, где он перекрывается?Я попытался изменить непрозрачность цвета фона на 1, но это не имеет никакого значения.Менее заметно, если я изменю цвет фона на yellow, но я бы предпочел оставить его ближе к цвету родной ОС.

* { font-size: 16px; font-family: sans-serif; }

p {
  line-height: 0.5rem;
}

p::selection { 
  background-color: rgba(172, 206, 247, 1.0);
}

<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Corporis, delectus incidunt, numquam sint saepe officia. Cum, porro! Animi atque, veniam voluptate, iure at quae, est dolores unde, accusamus nesciunt amet.</p>

Эффект не заметен в Safari.Меня беспокоит Google Chrome.

Как можно предотвратить это потемнение на перекрывающихся высотах строк в выделенном тексте?

Answer 1

Непрозрачность 1 полностью непрозрачна и используется по умолчанию.Установка более низкого значения, кажется, помогает:

* { font-size: 16px; font-family: sans-serif; }

p {
  line-height: 0.5rem;
}

p::selection { 
  background-color: rgba(172, 206, 247, .3);
}

<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Corporis, delectus incidunt, numquam sint saepe officia. Cum, porro! Animi atque, veniam voluptate, iure at quae, est dolores unde, accusamus nesciunt amet.</p>