最初のDivへのホバー効果：after後のDivの要素

Question

2つ目のdivに配置された:: after要素をアクティブにする1つのdivにホバー効果が必要です。

ここに私のコード：

a{ 
 
    color:green; 
 
} 
 
     
 
div.one:hover div.two::after { 
 
    color: red; 
 
    content:"Zusatztext"; 
 
}

<a href="#"> 
 
     <div class="one"> 
 
     Text1 
 
     </div> 
 
     <div class="two"> 
 
     Text2 
 
     </div> 
 
    </a> 
 
    
 

二のdivは、最初のdivの子孫要素ではないので、私の推測が正しい、それが機能しないこと、ありますか？

（リンク）に：ホバー効果を置くことができます。ここ

これは、作業を行います。

a:hover div.two::after { 
     color: red; 
    content:"Zusatztext"; 
} 

敬具、 ミラノ

Answer 1

セレクタ間+を追加するには、あなたが探している結果を実現します。 Adjacent sibling combinator

~の間に要素を追加する必要がある場合は、兄弟が最初の要素の直後にある場合は、これが機能します。 General sibling combinator

これを試してみてください：

a{ 
 
    color:green; 
 
} 
 

 
div.one:hover + div.two::after { 
 
     color: red; 
 
    content:"Zusatztext"; 
 
}

<a href="#"> 
 
    <div class="one"> 
 
    Text1 
 
    </div> 
 
    <div class="two"> 
 
    Text2 
 
    </div> 
 
</a>