使用CSS更改文本选择颜色？

Question

我目前正在开发一个网站,我想更改文本选择颜色.

我有点工作.这是我的样式表中的代码(的一部分):

::selection {
  background: #FF0099;
  color: black;
  text-shadow: none;
}

::-moz-selection {
  background: #FF0099;
  color: black;
  text-shadow: none;
}

它产生了令人满意的结果.但是,在某些情况下,突出显示似乎失去了它的给定颜色(#FF099),如下图所示:

如上图所示,文本使用正确的颜色完全突出显示(#FF099); 但是,正文文本和标题之间以及正文文本左侧的区域以默认颜色(蓝色)突出显示.如何将突出显示的部分内容恢复为默认值？

编辑:较大的图片可在http://i.imgur.com/NmZIf.png获取

一个片段:

::selection {
    background: #FF0099;
    color: black;
    text-shadow: none;
}

::-moz-selection {
    background: #FF0099;
    color: #EEE;
    text-shadow: none;
}

<p>sample</p>
<br />
<p>sample2</p>

Answer 1

我之前已经徘徊过这个问题,事实证明:

::selection (or whatever selection you might use)

不适用于断行标记(br)..删除它们并使用边距代替.=)这是一个小提琴演示:例子

Answer 2

试试这个 :

<style>
*::selection {
  background: #cc0000;
  color: #ffffff;
}
*::-moz-selection {
  background: #cc0000;
  color: #ffffff;
}
*::-webkit-selection {
  background: #cc0000;
  color: #ffffff;
}
</style>

参见更多资料

Answer 3

/*** Works on common browsers ***/
::selection {
    background-color: #352e7e;
    color: #fff;
}

/*** Mozilla based browsers ***/
::-moz-selection {
    background-color: #352e7e;
    color: #fff;
}

/***For Other Browsers ***/
::-o-selection {
    background-color: #352e7e;
    color: #fff;
}

::-ms-selection {
    background-color: #352e7e;
    color: #fff;
}

/*** For Webkit ***/
::-webkit-selection {
    background-color: #352e7e;
    color: #fff;
}