我想使用“:is()”伪类对特定的“直接位于正文内部的部分”和“直接位于正文内部的 div 内部的部分”进行样式设置，而无需冗余（使用相对选择器）。
我在index.html 文件中有以下代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" href="style.css">
<title>Test :is() Selector</title>
</head>
<body>
<section>Section directly inside the body (styled).</section>
<div>
<section>Section directly inside a div wich is directly insdie the body (styled).</section>
</div>
<div>
<div>
<section>Section directly inside a div wich is directly inside another div which is directly inside the body (not styled).</section>
</div>
</div>
</body>
</html>
以及 style.css 文件中的以下 css：
body > :is(section, div > section) {
background-color: lightblue;
padding: 10px;
border: 1px solid blue;
}
我尝试搜索，但没有成功，因为所有使用“:is()”伪类和相对选择器的搜索都会直接将我发送到相对选择器文档，因为“is”是一个非常常见的单词，没有特殊字符。 这是我在堆栈中的第一个问题（虽然我每天都会阅读这个网站很长一段时间），但我需要的是一些没有冗余的复杂选择器，它的结果与这个 CSS 相同：
body > section, body > div > section {
background-color: lightblue;
padding: 10px;
border: 1px solid blue;
}
您可以使用
&:is()body {
:is(&, & > div) > section {
background-color: lightblue;
padding: 10px;
border: 1px solid blue;
}
}<section>Section directly inside the body (styled).</section>
<div>
<section>Section directly inside a div wich is directly insdie the body (styled).</section>
</div>
<div>
<div>
<section>Section directly inside a div wich is directly inside another div which is directly inside the body (not styled).</section>
</div>
</div>这是一个解决方案（我目前正在研究它为何有效，并将编辑我的答案并进行解释）：
:is(body, body > div) > section {
background-color: lightblue;
padding: 10px;
border: 1px solid blue;
}<section>Section directly inside the body (styled).</section>
<div>
<section>Section directly inside a div wich is directly insdie the body (styled).</section>
</div>
<div>
<div>
<section>Section directly inside a div wich is directly inside another div which is directly inside the body (not styled).</section>
</div>
</div>如果我正确理解您的问题（否则请编辑您的问题以使其清晰）：
您想实现此行为：
body > section, body > div > section {
background-color: lightblue;
padding: 10px;
border: 1px solid blue;
}
但是你想通过使用 :is() 伪类使其更加
简洁，当你说“没有冗余”时，你的意思是保持选择器DRY？
您当前的 DRY 选择器无法正常工作：
body > :is(section, div > section) {
background-color: lightblue;
padding: 10px;
border: 1px solid blue;
}<section>Section directly inside the body (styled).</section>
<div>
<section>Section directly inside a div wich is directly insdie the body (styled).</section>
</div>
<div>
<div>
<section>Section directly inside a div wich is directly inside another div which is directly inside the body (not styled).</section>
</div>
</div>