css - 开发人员有没有办法以与默认颜色不同的颜色突出显示网站上的浏览器 (f3) 搜索结果？

Question

我正在建立一个配色方案中带有亮黄色的网站。该方案不能更改。在某些地方，它用于突出显示文本。现在我认识到黄色与突出显示您的搜索词的黄色完全相同，当您在网站内使用 F3 搜索时，由于它是大量文本内容，我相信它会导致一些用户的可用性问题和混淆。

有没有办法覆盖浏览器搜索用来突出显示文本的颜色（如用户代理样式表或 js 库中的值），或者这是否已融入软件而没有任何可能的干扰？

标签： cssgoogle-chromefull-text-searchmicrosoft-edgeuser-agent

Answer 1

有::selection，但唯一使用它来突出显示搜索结果的浏览器似乎是 Edge (EdgeHTML)，即使这样，它也只用于活动结果 - 不是所有结果。

::selection {
  background-color: #9900ff;
  color: white;
}

Search, search

此外，浏览器如何实现这一点之间存在一些差异，

• Chromium 使用橙色表示活跃结果，黄色表示休息。
• Edge 使用 ::selection 表示活动结果，黄色表示休息。
• Firefox 使用绿色表示活动结果，紫色表示休息。

作为最终的解决方法，您可以通过markjs或类似方法实现自定义搜索，但似乎应该有比这更好的方法。