技术相关 · 2015年3月2日

CSS3 ::selection 选择器

::selection 选择器匹配被用户选取的选取是部分。

只能向 ::selection 选择器应用少量 CSS 属性:color、background、cursor 以及 outline。

IE Firefox Chrome Safari Opera
 u=1821132567,1125631962&fm=23&gp=0  13667845605787  u=655622312,3131975357&fm=90&gp=0  13667275416467  u=4155554963,1159645623&fm=23&gp=0

IE9+、Opera、Google Chrome 以及 Safari 中支持 ::selection 选择器。

Firefox 支持替代的 ::-moz-selection。

实例

使被选中的文本成为红色:

 <style>
*{margin:0; padding:0; list-style:none;}
.box{width:200px; margin:0 auto; line-height:30px;}
::selection{color:red;}
</style>
<div class="box">
 <ul>
 <li>HTML5</li>
 <li>CSS3</li>
 <li>Javascript</li>
 </ul>
</div>

运用这个选择器 使网站更具独特性!