:: selection中剩下的蓝色？

Question

在::selection { }CSS元素选择应该有我们自己的文字和背景颜色的选择,以取代默认的蓝色文本选择.

然而,这似乎并非总是如此,因为我经常看到具有剩余蓝色的网站.它并没有完全被我们自己选择的颜色所取代.

======编辑======

我想通过我们自己的眼睛比通过截图更容易看到.

请参阅此页面,例如:bleachindonesia.com/2012/05/27/bleach-day

在该页面上,如果您尝试全选(Ctrl + A),您将看到文本将被阻止/选择为灰色.是的,因为页面CSS使用::selection, ::-moz-selection { background:#59574b;color:#fdfcf5; }.

但是,正如您在下面的屏幕截图中看到的那样,它会在某些部分留下一些默认的蓝色选择.

http://i.stack.imgur.com/A0aUJ.png

注意颜色差异,同时注意未选择的部分.网站上有一些部分使用默认的蓝色::选择进行选择,但同时还有一些其他部分未被选中.

---

同时,还有这个页面:24ways.org/2005/swooshy-curly-quotes-without-images

再次尝试选择所有(Ctrl + A)页面.你可以看到所有的选择都是完美的栗色.没有默认的蓝色选择.只有部分未被选中,但没有默认的蓝色选择.如下面的截图所示:

http://i.stack.imgur.com/4o6ll.png

页面CSS？::selection { background-color: rgba(179, 45, 71, .75); color: #fff; }.与第一页的唯一区别是它使用RGBA而不是十六进制代码.我认为它没有任何区别 - 它本质上是相同的代码.

现在让我惊讶的是什么.

为什么在第一页上默认的蓝色选择仍然存在,但它不会在第二页上持续存在？而且,如何使它像第二页一样完美？

Answer 1

坦率地说,很难说这是否是错误的行为,虽然我猜测它看起来非常像它.::selection由于缺乏正确的定义(因而缺乏适当的实施和测试),所以我敢打赌,即使浏览器供应商也难以找出问题所在.

值得一提的是,这条规则来自第一个网站:

::selection, ::-moz-selection { background:#59574b;color:#fdfcf5; }

看起来非常温和,除了它错误地组合::selection并且::-moz-selection它在Firefox中永远不会起作用,因为它不能识别::selection并丢弃整个规则.24ways.org也没有在Firefox中正确显示选择颜色,不是因为组合选择器,而是因为首先没有::-moz-selection选择器.

至于为什么Chrome和Safari在第一个网站的某些区域留下了蓝色区域,我真的不知道.但是,我认为Jared Farrish提出了一个很好的观点:

这复制了Chrome中的问题(至少):jsfiddle.net/RfPgt似乎是一个元素嵌套在另一个元素中,而该元素本身具有可选元素.