簡單的不選擇不工作在CSS

Question

我有一個簡單的例子解釋CSS中的不選擇。我期待每一個元素都有紅色邊框。但沒有人有。哪裏有問題？

[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([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>

Answer 2

您是否嘗試過使用:not選擇？

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