Question

以下是我试过的代码

HTML

<div>
     <span>Span1</span>
     <span>Span12</span>
     <span>Span13</span>
</div> 

<div>
     <span>Span1</span>
     <span>Span12</span>
     <span>Span13</span>
</div> 

<span>Span2</span> 
<span>Span3</span>

CSS

 :not(div>span)
   {
      color : #ff0000;
   }

我希望使用非选择器

将span2和span3的范围设为红色

检查Js小提琴

http://jsfiddle.net/82KwV/

Answer 1

:not接受simple selector作为参数。 div > span不是简单的选择器，因此不能在该上下文中使用。结果，你不能说＆＃34;我希望那些不是div父母的跨度为红色＆＃34;在CSS中你必须妥协。

一种可能性是针对一般情况的特定子集。例如，没有div父母的所有跨度的微妙差异＆＃34;对应于：

:not(div) > span { color: red }

在更复杂的场景中，这种方法可能不可行（例如，您不能使用div, p而不是上面的div），在这种情况下，您必须转向其他选项，例如＆＃34 ;做/撤消＆＃34;特技：

span { color: red }
div > span { color: inherit }

这种安排很容易扩展到p > span, div > span，但当然需要权衡：这些规则可能会覆盖样式表中的其他内容。

Answer 2

:not不允许使用此类选择器。更好地使用

body > span { color: red }

这比使用多个规则将其修补更清晰。

css中的选择器不工作？

2 个答案: