当网页中的文本被用户选中，被选中的文本通常会呈现出蓝底白字的样子，并且，不论原来的文本做了什么样的修饰，是设置了前景色，还是做了突出显示，默认情况下，文本颜色都是白色。选中区域默认的蓝底白字没有什么不好，不过别样的文本选中样式应该极具表现力，一些特殊场景可能会有这方面的需求。

自定义文本被选中的样式，我们可以使用CSS的伪元素::selection来实现。如下CSS设置，将使得 class="mum" 的容器里的一切文本在被选中区域中拥有与默认样式不同的样子，请试着选择代码框中的文本，本文自身也设置了 ::selection 样式，也可以尝试一下，然后再去别处选择文本以便比较一下这里和它们的区别：

::selection除了上述 background-color 或 background 设置，还可以设置少量的属性，以下是可以在 ::selection 伪元素选择器下使用的属性列表：

以上属性不是一旦设置就能生效，因为，原因之一是有一部分属性存在环境依赖，例如插入光标，通常仅出现在可在线编辑的区域，还可能有其他的原因，比如浏览器还没有支持，等等。通常，最常用的就是背景色和前景色设置。

【小技巧】正如本帖示例展示的代码那样，可以使用有透明度的颜色设置 ::selection 背景，且无需设置文本前景色，如此，文本原本的着色设计在用户选中时依然产生作用，阅读选中的文本时环境更为友好。