nth-child选择器不起作用

Question

我得到了这样的动态结果：

<div class="statusContent">
   <div class="statusBox">
     <div class="title">Title</div>
     <div class="subTitle">Subtitle</div>
   </div>

   <div class="statusBox">
     <div class="title">Title</div>
     <div class="subTitle">Subtitle</div>
   </div>

    <div class="statusBox">
     <div class="title">Title</div>
     <div class="subTitle">Subtitle</div>
   </div>

   .....
</div>

我不知道statusBox级的div的数量。我试图仅为1,3,5,7 ... div应用css statusBox类。

我尝试使用下一个css：

.statusContent div:nth-child(2n+1){
    margin-right: 2%;
  }

但这种风格也适用于title和subtitle类的div。

如何仅将其应用于statusBox类的div？

Answer 1

.statusContent .statusBox:nth-child(odd)这仍然只适用于.statusContent直接子节点的div。你不能仅仅根据类

来做基于nth的东西