ID和子组合器简化了

Question

我有7个具有相同子组合器的ID，如何简化它，所以我不必像下面这样写出来：

#section-monday > div > div > div:nth-child(1),
#section-tuesday > div > div > div:nth-child(1),
#section-wednesday > div > div > div:nth-child(1),
... {}

我可以以某种方式对ID进行分组，并使用子组合器仅跟踪一次吗？

喜欢

"#section-monday, #section-tuesday, #section-wednesday" > div > div > div:nth-child(1){}

谢谢。

Answer 1

您可以使用部分ID文本作为选择器， 但在这种情况下您应该使用一个类

[id*="section-"] > div > div > div:nth-child(1){
border:1px solid red;
}

<div id="section-monday">
  <div>
    <div>
      <div>
        :D
      </div>
      <div>
        :(
      </div>
    </div> 
  </div> 
</div>
<div id="section-tuesday">
  <div>
    <div>
      <div>
        :D
      </div>
      <div>
        :(
      </div>
    </div> 
  </div> 
</div>
<div id="section-monday">
  <div>
    <div>
      <div>
        :D
      </div>
      <div>
        :(
      </div>
    </div> 
  </div> 
</div>
<div id="section-wednesday">
  <div>
    <div>
      <div>
        :D
      </div>
      <div>
        :(
      </div>
    </div> 
  </div> 
</div>