html – CSS3 ::选择选择器在锚标签上无法正常工作

发布时间：2020-12-14 19:42:35 所属栏目：资源来源：网络整理

导读：我正在使用这样的 CSS3 :: section Selector ::selection{ color:red; background-color:pink;}::-moz-selection { color:red; background-color:pink;} 因此,当选择某个元素时,它应将其颜色更改为红色,将背景更改为粉红色. 除了Anchor标签 a之外,它可以按预

我正在使用这样的 CSS3 :: section Selector

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

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

}

因此,当选择某个元素时,它应将其颜色更改为红色,将背景更改为粉红色.

除了Anchor标签< a>之外,它可以按预期工作.

选择锚文本时,它会将样式应用于链接文本,但不会应用于锚文本下方的行.

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

那么我们怎样才能将样式应用到下划线呢？

PS：浏览器测试：chrome 31和firefox 25.0.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.

链接上的行是文本修饰的一部分,伪选择器不会考虑这一行.你最好的选择可能是使用它删除它

a{
 text-decoration:none;
}

您可能还想注意：

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

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

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!