在 CSS 中，锚标记上的伪元素“not”不起作用答案

【问题标题】：In CSS, pseudo element 'not' on anchor tag is not working在 CSS 中，锚标记上的伪元素“not”不起作用
【发布时间】：2015-12-16 23:11:30
【问题描述】：

在 CSS 中，我尝试应用没有在悬停和活动的锚标记上的伪元素，但它不起作用。

a:not(a[name="nobgcolor"]):hover{color:#ffff35;background-color:#ff3355;}
a:not(a[name="nobgcolor"]):active{color:#ffff35;background-color:red;}

我在悬停和活动超链接中应用了背景颜色。但我希望不出现背景颜色，其中属性以 name="nobgcolor" 的形式存在。在早些时候，我想在具有顶部的 href 上应用相同的内容。（转至顶部）但不起作用，所以我将 name="nobgcolor" 放在同一个地方并尝试相同的方法！！！

a:hover:not(a[href*="#top"]){color:#ffff35;background-color:#ff3355;}
a:active:not(a[href*="#top"]){color:#ffff35;background-color:red;}

但代码不起作用，它们适用于整个页面并删除背景颜色。请指导我对这种情况该怎么办？？？

【问题讨论】：

标签： css

【解决方案1】：

你需要从内部移除一个标签，因为它针对的是同一个元素

a:hover:not([href*="#top"]) {
  color: #ffff35;
  background-color: #ff3355;
}
a:active:not([href*="#top"]) {
  color: #ffff35;
  background-color: red;
}

<a href="" name="nobgcolor">test</a>
<br>
<a href="" name="">test1</a>
<br>
<a href="#top" name="nobgcolor">test</a>
<br>
<a href="" name="">test1</a>

a:hover:not([name="nobgcolor"]) {
  color: #ffff35;
  background-color: #ff3355;
}

a:active:not([name="nobgcolor"]) {
  color: #ffff35;
  background-color: red;
}

<a href="" name="nobgcolor">test</a>
<br>
<a href="" name="">test1</a>
<br>
<a href="" name="nobgcolor">test</a>
<br>
<a href="" name="">test1</a>

【讨论】：