Firefox和Chrome坚持蓝色::选择背景

Question

我无法让Chrome（41）和Firefox（36）将特定颜色应用于整个选择背景，尽管指定了橙色背景，但某些区域仍为蓝色。

考虑以下示例：

::selection
{
  background: rgba(255, 127, 0, 0.996);
  color: white;
}

::-moz-selection
{
  background: #F80;
  color: white;
}

img::selection
{
  background: rgba(255, 127, 0, 0.8);
  color: white;
}

<p>The domestic cat is a small, usually furry, domesticated, and carnivorous mammal. They are often called a housecat when kept as an indoor pet, or simply a cat when there is no need to distinguish them from other felids and felines. Cats are often valued by humans for companionship.</p>
    <img src="http://placekitten.com/g/75/300">
    <img src="http://placekitten.com/g/300/300">
    <img src="http://placekitten.com/g/150/300">
<p>A Melvin, Michigan woman was brutally attacked by a stray cat and shocking footage of the mauling has already gained a million views on YouTube.</p>
<p>The woman, who identified herself to reporters only as Maxx, endured the horrific attack November 30 but only recently realized it had been caught on her home surveillance camera.</p>
<p>The attack left her face swollen and infected and the cat named Buddy dead as officials were forced to test it for rabies.</p>

按Ctrl + A时，Chrome（和Opera）将如下所示：

Firefox将如下所示：

令人惊讶的是，Internet Explorer（11）是正确的：

在上面的Chrome和Firefox示例中，有没有办法让整个选择为橙色或白色/透明？

Answer 1

Chrome和家庭的问题（如小兄弟Opera，没有检查堂兄Safari）是::selection不适用于通过在块元素之前添加文本节点而创建的隐式块包装器。即使没有图像也可以看到这一点：

＆＃13;

＆＃13;

::selection
{
  background: rgba(255, 127, 0, 0.996);
  color: white;
}

＆＃13;

<p>Chrome loves you.</p>
Chrome hates you.
<p>Chrome is tsundere.</p>

＆＃13;

＆＃13;

＆＃13;

在Ctrl + A后，Chrome上的结果如下所示：

这些图像到底发生了什么。见这个例子：

＆＃13;

＆＃13;

::selection
{
  background: rgba(255, 127, 0, 0.996);
  color: white;
}

::-moz-selection
{
  background: #F80;
  color: white;
}

img::selection
{
  background: rgba(255, 127, 0, 0.8);
  color: white;
}

＆＃13;

<p>The domestic cat is a small, usually furry, domesticated, and carnivorous mammal. They are often called a housecat when kept as an indoor pet, or simply a cat when there is no need to distinguish them from other felids and felines. Cats are often valued by humans for companionship.</p>
<p>
    <img src="http://placekitten.com/g/75/300">
    <img src="http://placekitten.com/g/300/300">
    <img src="http://placekitten.com/g/150/300">
</p>
<p>A Melvin, Michigan woman was brutally attacked by a stray cat and shocking footage of the mauling has already gained a million views on YouTube.</p>
<p>The woman, who identified herself to reporters only as Maxx, endured the horrific attack November 30 but only recently realized it had been caught on her home surveillance camera.</p>
<p>The attack left her face swollen and infected and the cat named Buddy dead as officials were forced to test it for rabies.</p>

＆＃13;

＆＃13;

＆＃13;

将img包裹在这样的p之后，我们在Chrome上有这个：

Firefox仍然是一个谜。如果不是因为我之前对CSS的可能性感到困惑，那我就不可能使用CSS＆＃34 ;,而且浏览器有时会像{{{{ 1}}让我感到困惑）。如果做不到这一点，应该可以用javascript做某事。使用CSS -webkit-appearance可以对图像进行着色，这是最难的部分。