如何防止所选文本中重叠的行高变暗

Question

当文本的行高过紧时，是否可以控制不透明度，使其在重叠的地方不会变暗？我尝试将背景色的不透明度更改为1，但没有任何区别。如果我将背景颜色更改为yellow，则不太明显，但我希望将其保持更接近本机OS颜色。

* { 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>