css最も近いアイテムを見つける

Question

私は同じ要素を含むネストされた構造を持っています。このセレクタは、はるか要素を持っている実際の生活では

.set1 > .content > .trigger { 
    background: red; 
} 

：唯一の現在のセット内の要素をターゲットに私はこのような何かを行います。それが機能している間、私が要素の1つの名前または深さを変更すると、もはや機能しません。

現在のセットの.trigger（この場合）を見つける方法はありますか？

Answer 1

現在のセット内のすべてのトリガーにスタイルを適用してから、最初のトリガーの後に来る他のトリガーのスタイルを削除できます。

div { 
 
    padding: 5px; 
 
    border: 1px solid; 
 
} 
 

 
.set1 .trigger { 
 
    background: red; 
 
} 
 

 
.set1 .trigger ~ .set .trigger { 
 
    background: none; 
 
}

<div class="set set1"> 
 
    <div class="content"> 
 
    <div class="trigger"></div> 
 
    <div class="set set2"> 
 
     <div class="content"> 
 
     <div class="trigger"></div> 
 
     </div> 
 
    </div> 
 
    </div> 
 
</div>