为什么 :not(p) 选择段落？

Question

:not(p) {
  color: #ff0000;
}

<h1>This is a heading</h1>

<p>This is a paragraph.</p>
<p>This is another paragraph.</p>

<div>This is some text in a div element.</div>

<a href="https://www.w3schools.com" target="_blank">Link to W3Schools!</a>

用于选择未指定元素的每个元素，因此在上面的代码中，我在两个未选择的项目not(selector)上都得到红色。p

我只期望div, a,h1为红色，而不是p指定p的元素，并且它意味着离开并且样式必须应用于所有其他元素？

Answer 1

选择器:not(p)将选择所有不是p元素的元素：这包括html和body。我们正在color对这两个要素进行设置。

此外，该属性color默认是继承的。

默认情况下color继承并且我们设置color为body红色，元素将从其父元素p继承红色值，即。colorbody

您可以仅选择 的子代body，这意味着的事实上的浏览器默认黑色将由body元素color继承p，而所有其他不是p元素的子代将设置color为红色。

注意：使用选择器时body :not(p)，只有 的子代body才会color评估为黑色。其他元素将设置color为红色，其间接p后代body将继承。

p但元素拥有某种属性的最简单方法color是设置它（而不是继承它）。