::selection

CSS ::selection 伪元素代表文档中被用户选择并处于高亮状态的一段内容。

例如用户使用鼠标或其它方式选择了一段文本，单文本被选择时，它处于高亮状态，默认背景为蓝色，前景字体颜色为白色：

只有一部分CSS属性可以用于为 ::selection 伪元素代表的元素指定样式，它们是：、和。

你也可以使用属性来为选中的片段设置样式，但是不支持背景图片。因此，属性也只能用于设置背景颜色。

::selection 是CSS3草案中引入的一个属性，但是目前这个属性已经被移除，不是标准的CSS属性。但是，大多数的现代浏览器仍然支持这个属性。

示例代码

下面的示例代码为页面中被选中的内容设置前景色和背景色。

::selection {
    background-color: #222;
    color: white;
}

在线演示

这段文字被选中时，背景色为绿色，文字为白色。

这段文字被选中时，背景色为金色，文字为白色。

这段文字被选中时，背景色为粉红色，文字为白色。

这段文字被选中时文字将带有阴影效果。

浏览器支持

支持 ::selection 伪元素的浏览器有：Chrome, Safari, Opera, Internet Explorer 9+。

Firefox浏览器需要添加 -moz- 前缀： ::-moz-selection 。

支持 ::selection 伪元素选中的片段使用属性的浏览器有：Chrome, Safari, Opera, Firefox。

查看更多关于::selection的详细内容...