html中的选择器事例,CSS中Selection 伪类选择器示例

css中::selection可以重点显示页面中要显示的内容了，如可以通过color ， background-color ，background来进行设置下文来给各位介绍一个例子。

::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前端开发 p{text-shadow:2px 2px 5px #333333;} p::-moz-selection{background:#000;color:#f00;text-shadow:2px 2px 5px #FFFF2E;} p::selection{background:#000;color:#f00;text-shadow:2px 2px 5px #FFFF2E;} 选中下面的文字，看看它的颜色 你选中这段文字后，看看它们的文本颜色和背景色，就能明白::selection的作用。 效果如下