css - 前の兄弟を取得する CSS セレクター

Question

純粋な CSS(3) を使用して、特定のクラスを持つ要素の前の兄弟である要素を選択する方法はありますか?

すなわち:

html:

<div id='element-to-find'></div>
<div id='box1'></div>
<!-- a bunch more DOM elements between here --->
<div id='box2'>
      <div id='inner-box'></div>
</div>

CSS:

#box1{ /*some styling*/ }
#box2{ /*some styling*/ }

#box2.active .....

ここで、 #box2 にクラスがありactive、 のスタイルを選択して何かを実行したいと考えています#element-to-find。これを達成する方法はありますか？

Answer 1

セレクターをこれ以上知らなくても、CSS の :not() セレクターを使用できる可能性があります。

div:not(#box1), div:not(#box2) {
    /*some style here*/
}

#element-to-findbox2 を選択してスタイルの準備ができたら、クラスも指定することをお勧めします。