简单的非选择器在 CSS 中不起作用 [重复]

Question

我有一个简单的例子来解释 CSS 中的 not 选择器。我希望每个元素的边框都是红色的。但没有人拥有。问题出在哪里？

[name!='er']{border:2px solid red;}

<p name='peter'>This is paragraph 1.</p>

<p name='julie'>This is paragraph 2.</p>

<p name='jennifer'>This is paragraph 3.</p>

<p name='george'>This is paragraph 4.</p>

<p name='gilbert'>This is paragraph 6.</p>

<span name='rosy'>This is span 1.</span>

<span name='robert'>This is span 2.</span>

https://api.jquery.com/attribute-not-equal-selector/

这个选择器存在于 jQuery 中。我也希望 CSS 也一样。不是吗？

Answer 1

您是否尝试过使用:not 选择器？

:not([name='er']) { 
  border: 2px solid red;
}

Answer 2

这就是你的选择器应该的样子。

:not([name='er'])

您需要了解:not 运算符。

*:not([name='er']) {
  border: 2px solid red;
}

<p name='peter'>This is paragraph 1.</p>

<p name='julie'>This is paragraph 2.</p>

<p name='jennifer'>This is paragraph 3.</p>

<p name='george'>This is paragraph 4.</p>

<p name='gilbert'>This is paragraph 6.</p>

<span name='rosy'>This is span 1.</span>

<span name='robert'>This is span 2.</span>