一聚教程网:一个值得你收藏的教程网站

热门教程

CSS中Selection 伪类选择器示例

时间:2022-06-25 13:43:33 编辑:袖梨 来源:一聚教程网

::selection 伪类选择器用于突出显示的页面用户选择的任何部分,包括可编辑文本字段中的文本。

此伪元素可应用于 color , background-color ,background(background-color 部分) 和text-shadow(注:到目前位置IE下该属性无效)属性。设置其他属性是没有任何效果的。


火狐下需要加-moz-属性前缀;

支持浏览器:Chrome,Firefox (Gecko),Internet Explorer 9+,Opera,Safari

例如:

 代码如下 复制代码

/* draw any selected text yellow on red background */
::-moz-selection { color: gold;  background: red; }
::selection      { color: gold;  background: red; }
 
/* draw selected text in a paragraph white on black */
p::-moz-selection { color: white;  background: black; }
p::selection      { color: white;  background: black; }

一个完整的例子:

 代码如下 复制代码





CSS ::Selection 伪类选择器-WEB前端开发




选中下面的文字,看看它的颜色


你选中这段文字后,看看它们的文本颜色和背景色,就能明白::selection的作用。



效果如下

 

CSS中Selection 伪类选择器示例

热门栏目