如何在浏览器中检查并修改文本选中高亮的CSS属性？

一、在浏览器中定位高亮对应的CSS规则 #

• 打开浏览器开发者工具：按下F12或Ctrl+Shift+I（Mac为Cmd+Opt+I）
• 触发文本选中状态：用Ctrl+A全选页面文本，或手动选中一段内容；接着在开发者工具的「元素」面板里，右键点击目标文本所在元素，选择「强制元素状态」→「:selection」，锁定选中状态的样式
• 在「样式」面板中查找::selection伪元素的规则，这就是控制选中文本高亮的核心代码

二、修改高亮样式 #

找到::selection规则后，调整以下两个关键属性即可：

::selection {
  /* 修改高亮背景色 */
  background-color: #e6f3ff;
  /* 修改选中后的文本颜色 */
  color: #2d3748;
}

针对Minimal Mistakes主题，建议将自定义CSS代码添加到主题的自定义样式文件（如assets/css/main.scss）中，不要直接修改主题核心文件，方便后续版本更新。

另外，你之前用grep检索的关键词不准确，应该搜索::selection或selection，就能快速定位到相关规则。

内容的提问来源于stack exchange，提问作者Gabriel Staples