如何更改浏览器中所选文本的背景颜色？答案

【问题标题】：How to change the background color of the selected text in browsers?如何更改浏览器中所选文本的背景颜色？
【发布时间】：2015-12-02 05:38:36
【问题描述】：

我们都知道，当我们在浏览器中选择文本部分时，它的背景颜色会变为蓝色。是不是可以通过 CSS 或 JavaScript 来改变这种颜色？

【问题讨论】：

标签： javascript html css browser cross-browser

【解决方案1】：

是的：您可以使用::selection 和::-moz-selection 伪元素（MDN），它允许您指定所选内容的前景色和背景色。这将适用于所有主流浏览器，除了 IE

::selection {
    background: pink;
    color: yellow;
}

::-moz-selection {
    background: pink;
    color: yellow;
}

【讨论】：

您在哪个浏览器中检查？检查答案中提供的页面末尾给出的浏览器兼容性表。
您的权利。我在行动中看到了它。但我不知道为什么它不能在我的本地机器上运行。

【解决方案2】：

Windows 版 Internet Explorer

1.从工具菜单中，选择 Internet 选项...。

2.单击常规选项卡，然后单击颜色...按钮。您可以选择已访问、未访问和悬停颜色。如果您还想设置自定义文本和背景颜色，请取消选中使用 Windows 颜色。单击确定。注意：在 Internet Explorer 7 或更高版本中，您需要取消选中使用 Windows 颜色来修改任何默认颜色。

3.如果您想用自己的颜色覆盖页面设置的颜色，请单击“辅助功能...”，然后选中“忽略网页上指定的颜色”。单击确定。

4.单击“确定”保存更改并关闭“Internet 选项”窗口。苹果浏览器 Safari 不允许您轻松更改背景、文本、已访问链接和未访问链接颜色。但是，您可以使用自己的样式表来查看网页：

从 Safari 菜单中，选择首选项...。

2.在打开的窗口中，单击高级。

3.从“样式表：”旁边的下拉菜单中，选择其他...，然后导航到您要使用的样式表。

4. 单击选择。

Firefox 3.x

1.如果您使用的是 Windows 或 Linux，请从“工具”菜单中选择“选项...”。在 Mac OS X 中，从 Firefox 菜单中选择 Preferences...。

2.单击内容。在“字体和颜色”下，单击颜色...。

3.选择背景、文本、已访问链接和未访问链接的颜色。

4.如果您想用自己的颜色覆盖网站的颜色设置，请取消选中允许页面选择自己的颜色，而不是我上面的选择。

【讨论】：

感谢您的精彩解释，但我的意思是作为网页的开发人员，而不是作为最终用户。我无法访问他们的浏览器。但是 +1 表示贡献好 :)
问题是关于通过 CSS 或 JS 改变颜色 :)
你是对的，何塞......最好多一点关于同一个主题的知识，然后少一点，但你是对的。

【解决方案3】：

对于最完整的工作，您可以使用具有相同功能但在不同浏览器中使用的多个选择器：

::selection {
    background: orange;
    color: white;
}

::-moz-selection {
    background: orange;
    color: white;
}

::-webkit-selection {
    background: orange;
    color: white;
}

::-o-selection {
    background: orange;
}

::-ms-selection {
    background: orange;
    color: white;
}

-moz- 火狐。

-webkit- Safari 和 Chrome。

-o- 歌剧。

-ms- Internet Explorer。

【讨论】：