用于排除孙元素的CSS选择器

Question

你怎么不选择CSS中元素的第n个孩子的第n个孩子？

<div class="myclass">Root Div
    <div>1st Child
        <div>Child of 1st Child</div>
    </div>
    <div>2nd Child</div>
</div>

什么是选择器，因此类myclass未应用于

<div>Child of 1st Child</div>

Answer 1

考虑到你原来的HTML，更好的方法可能是将样式应用于所有 div，然后覆盖你想要定位的嵌套div的那些样式：

＆＃13;

＆＃13;

body {
  background-color: white;
}
div {
  background-color: aqua;
}
div.myclass > div:first-child > div:first-child {
  background-color: white;
}

＆＃13;

<div class="myclass">Root Div
  <div>1st Child
    <div>Child of 1st Child</div>
  </div>
  <div>2nd Child</div>
</div>

＆＃13;

＆＃13;

＆＃13;