html - CSS3::selection 选择器无法在 anchor 标签上正常工作

Question

我正在使用 CSS3 ::section这样的选择器

::selection{
    color:red;
    background-color:pink;

}
::-moz-selection {
    color:red;
    background-color:pink;

}

So when some element is selected it should change its color to red and the background to pink.

除了 anchor 标签 <a> 之外的所有内容都按预期工作.

选中 anchor 文本后，它会将样式应用于链接文本，但不会应用于 anchor 文本下方的行。

JSFiddle:http://jsfiddle.net/GcBT2/1/

那么我们如何将样式也应用到下划线呢？

PS:已测试浏览器:chrome 31 和 firefox 25.0.1

Answer 1

请注意 per MDN

Only a small subset of CSS properties can be used in a rule using ::selection in its selector: color, background, background-color and text-shadow. Note that, in particular, background-image is ignored, like any other property.

您链接上的行是 text-decoration 的一部分，伪选择器没有考虑它。您最好的选择可能是使用

删除它

a{
 text-decoration:none;
}

您可能还想注意:

Though this pseudo-element was in drafts of CSS Selectors Level 3, it was removed during the Candidate Recommendation phase (link)

The ::selection pseudo-element currently isn't in any CSS module on the standard track. It should not be used in production environments.

Further information