CSS：not选择器无效

Question

我想给标签上no-color的类。 仅当激活Javascript时，类别no-color才被删除，并且文本应被着色。 我当前的CSS无法正常工作。 这里是示例代码。 我不需要将类添加到p-tag的解决方案，因为这只是示例代码。

JS小提琴

萨斯

:not(.no-color) {
  p {
    color: red;
  }
}

的HTML

<div class="no-color">
  <p>hello world</p>
</div>

Answer 1

只需将div添加到选择器DEMO

div:not(.no-color) {
  p {
    color: red;
 }
}

或者在纯CSS中为div:not(.no-color) p

 div:not(.no-color) p { color: red; } 

 <div class="no-color"> <p>hello world</p> </div> <div> <p>hello world</p> </div> 

Answer 2

在:not之前使用div选择器

   div:not(.no-color) {
      p {
        color: red;
      }
     }

看到小提琴： https : //jsfiddle.net/on9oh2zd/4/

Answer 3

您应该像这样添加div：

div:not(.no-color) {
  p {

    color: red;

  }
 }

您的代码找不到度量