hover another css

css hover after

<center>
<div id="Adiv">
<img id="Aimg" src="https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcTpmn2hGr71Zs3GGh-ApMIb-oTXBwOosq2vMzqssmnO564xnvikzQ" />
<div id="text"></div>
</div>
</center>
<style>#Aimg ,#Adiv {height:100px ;width:150px;} 
#text:after  {content: "滑鼠請移到上圖"} 
#Adiv:hover  #text:after{content: "滑鼠可以離開"} </style> 

hi

hi

<center>
<div id="Bdiv">
<img id="Bimg" src="https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcTpmn2hGr71Zs3GGh-ApMIb-oTXBwOosq2vMzqssmnO564xnvikzQ" />
<div id="Atext">hi</div>
<div id="Btext">hi</div>
<div id="Ctext"></div>
</div>
</center>
<style>#Bimg , #Bdiv {height:100px ;width:150px;} 
#Ctext:after  {content: "滑鼠請移到上圖"} 
#Bdiv:hover  #Ctext:after{content: "滑鼠可以離開"} </style> 

<div class="ot" id="WhoverA" style="background-color: azure; border: 8px outset gainsboro; float: left; height:600px; width: 48%;" >
<center>
<img id="img" src="https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcTpmn2hGr71Zs3GGh-ApMIb-oTXBwOosq2vMzqssmnO564xnvikzQ" />
<div id="txt"></div>
</center>
<style>#img {height:100px ;width:150px;} 
#txt:after  {content: "滑鼠請移到上圖"} 
#img:hover + #txt:after{content: "滑鼠可以離開"} </style>
兩個獨立 div , hover 後面要加 +

<div id="div1">A</div> <div id="div2">B</div>	#div1:hover + #div2{  .css } 兩個獨立 div , hover 後面要加 +
<div id="div1">A <div id="div2">B </div> </div>	#div1:hover  #div2{  .css } div1 內 div2 hover 後面無需加 +

CSS hoverhovercss hover another滑鼠到止div:hover選擇器