请教一个 CSS 选择器的写法

Question

有HTML结构如下：

<div>  
  <p class="a">Quaerat sint repellat soluta.</p>
  <p>Lorem ipsum dolor sit.</p>
  <p>Soluta neque excepturi odio.</p>
  <p class="b">Quaerat sint repellat soluta.</p>
  <p>Numquam deserunt voluptatem perspiciatis?</p>
  <p>Magni cumque modi eaque.</p>
  <p class="c">Nemo totam ipsa sed?</p>
  <p>Repellendus a quos optio?</p>
  <p>Tenetur quas nesciunt sint!</p>
  <p>Temporibus eos nesciunt eum.</p>
  <p>Totam eaque odit doloribus?</p>
</div>

现在需要选择出 第一个没有 class 属性的 p 元素，将文字设置为红色，请教选择器如何写？

/*这个不行*/
div > p:not([class]):first-clild {
  color: red;
}

上面这个是选择 没有 class 属性并且是第一个的 p 元素 ，不符合要求。

我需要的是 没有 class 属性的 p 元素集合中的第一个

Answer 1

div > p:not([class]):first-child{
              color: red;
            }
            div > p[class] + p:not([class]){
              color: red;
            }
            div > p[class] + p:not([class]) ~ p{
              color: initial;
            }
            div > p:not([class]):first-child ~ p{
              color: initial;
            }