div（如果里面有另一个div）+ div {}

Question

如何制定一个可以做这样的事情的规则：

.container .unit：first-child（如果它在div.box1.extra中）+ .box2 {top：50px;}

<div class="container">
   <div class="unit">
       <div class="box1 extra"><!-- content --></div>
   </div>

   <div class="unit">
       <div class="box1"><!-- content --></div>
   </div>

   <div class="box2"><!-- content --></div>                 
</div>

Answer 1

遗憾的是，目前CSS无法实现。你所指的是使用CSS进行DOM遍历。你能做的就是简单地宣布规则。

.container .unit:first-child .box1.extra + .box2 { top: 50px;}

如果.box2元素不存在，则不会发生任何变化。对于具有.box2的单位，该规则将适用。

编辑：请注意，这只适用于.box2是.unit的孩子的情况。如果.unit和.box2是兄弟姐妹，那很遗憾不可能。