使用body :: selection，我想自定义高亮颜色

Question

为什么不能使用body::selection ，当我想要任何可以突出显示为我想要的颜色的东西时，任何东西都包括p img li h1

这里的例子现在我希望所有高亮显示为红色 ，但我使用body::selection ，它永远不会工作

http://jsfiddle.net/kent93/nu6ju/

Answer 1

如果要将选择背景应用于所有元素，请省略类型选择器：

::selection {
    background: red;
}

就此而言，添加::-moz-selection以便它也能在Firefox中运行：

::-moz-selection {
    background: red;
}
::selection {
    background: red;
}

---

从来没有决定你为E::selection为任何元素E设置的样式究竟应该如何传播到E后代。 在www风格的邮件列表中有更深入的讨论。 也是因为这个原因， ::selection已经完全从CSS3中删除了CSS3 UI的最新LC版本; 见本节 ，其中说：

:: selection伪元素在测试发现互操作性问题和探索/定义的更多细节之后，已经从选择器中删除了。

我最好的猜测是浏览器（至少是Firefox）不会对后代元素应用相同的规则。 因此，如果将伪元素应用于body ，则只有body文本将具有自定义选择背景; 嵌套在其中的所有东西都没有选择背景。

Answer 2

如果要停止级联，可以添加

body *::selection { background: inherit; }

因此，只有顶级文本才会选择红色。 示例： http ： //jsfiddle.net/nu6ju/4/