Webkit CSS - 选择器更改高亮颜色

Question

我注意到在Chrome中有一个很酷的效果，可能不仅仅是针对Chrome而是Webkit浏览器通用的，在这个网站上。当用户拖动以突出显示某些内容时，他们将默认颜色更改为粉色。

您能否确定选择器？

我想看看是否有一个参考页面描述这些类型的效果。

- Dale Rollinson

Answer 1

使用

::-moz-selection,
::selection{
    background: #fe57a1;
    color: #fff;
    text-shadow: none;
}

来自HTML5 BoilerPlate

- Zoltan Toth

---

注意：这个可以让它在Firefox以及Webkit浏览器中工作。 - Shauna

感谢提供链接和解决方案，很高兴能够一次快速简单地提问。 - Dale Rollinson

请注意，您不能将两个选择器组合在一起，否则它将失败。这意味着 ::selection，::-moz-selection {...} 将无效。 - Matt Kenefick

还有一点需要注意：这仅适用于段落文本（<p>）,而对于<div>无效。 - Mark

@Mark 怎么回事？http://jsbin.com/qanagenuqa/1/edit - 对我来说它可以运行..至少在Chrome中。 - Zoltan Toth

@ZoltanToth 似乎存在一个问题，当元素包含文本和子节点时。在这里第一行无法工作：http://jsbin.com/vikukobede/1/ （最新版本Safari） - Mark

Answer 2

我在那个页面中找到了这段CSS代码：

::selection {
  background: #E02F86;
  color: white;
}

此外，我在这里也进行了尝试。

- cambraca