网站地图    收藏   

主页 > 专题教程 > css >

::selection

来源:自学PHP网    时间:2018-02-08 10:48 作者: 阅读:

[导读] CSS ::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。

最新评论

添加评论

更多文章推荐

自学PHP网专注网站建设学习,PHP程序学习,平面设计学习,以及操作系统学习

京ICP备14009008号-1@版权所有www.zixuephp.com

网站声明:本站所有视频,教程都由网友上传,站长收集和分享给大家学习使用,如由牵扯版权问题请联系站长邮箱904561283@qq.com

添加评论