Css 使用类选择第一个Decentant_Css_Css Selectors

Css 使用类选择第一个Decentant

css

Css 使用类选择第一个Decentant,css,css-selectors,Css,Css Selectors,我无法控制html结构，因此，例如，如果我有此结构： <body> <div class="red"> <------ style this <div>content</div> <div class="red"> <div> <div class="red">content</div>

我无法控制html结构，因此，例如，如果我有此结构：

<body>
 <div class="red"> <------ style this
    <div>content</div>
    <div class="red">
     <div>
      <div class="red">content</div>
     </div>
    </div>
  </div>
</body>


红色
红色

首先，将所有具有

.red

类的元素作为目标。然后你把它从所有也上这门课的孩子身上移除

.red {
  background: red;
}

.red  .red {
  background: none;
}

您可以使用

CSS选择器只针对第一个元素，而不覆盖任何属性

body > .red { border: 1px solid red; }

div{padding:5px；}
body>.red{边框：1px纯红；}


这样做
内容
内容

这将适用于兄弟级别我正在尝试在html结构上选择它检查我的更新方法这将作为一种解决方法，您将不得不覆盖使用的属性，如果我没有其他答案，我会将其标记为正确的…我不清楚您想要什么。你说，“我只想用红色类为第一个DeceDant设置样式…”但是在你的HTML示例中，你有

我更新了示例，因为我说我无法控制dom，所以结构可以更改，更清楚地说，我想要dom树中的第一个Decentant。您接受的答案存在于您共享的链接中。只有当.red是身体的子对象时，它才会起作用。。。我不能控制html，所以结构可能会改变