影响两个div的CSS- HOVER

Question

我是CSS的新手。我有两个divs，div1和div2。
div2在div1内部，并且在div1上方盘旋，根据我的要求，该圈正在转变为蓝色背景。

我在div2里有一个字母“F”。现在，当背景颜色变为蓝色时，将鼠标悬停在div1上，我想让div2中的“F”变为白色。

我该如何去做这件事？

Answer 1

按您的要求 - TRY THIS DEMO

HTML：

<div id="div1"><div id="div2">F</div></div> 

CSS：

#div1 { 
    position:relative; 
    background:red; 
    width:400px; 
    height:400px; 
    line-height:200px; 
    border-radius:200px; 
    text-align:center; 
    font-size:24px; 
} 
#div1:hover { 
    background:blue; 
} 
#div2 { 
    position: absolute; 
    background:blue; 
    top:100px; 
    left:100px; 
    width:200px; 
    height:200px; 
    background-color:lawngreen; 
} 
#div1:hover #div2 { 
    color:white; 
} 

将帖子

根据你下面的评论：TRY THIS DEMO

这里是我的疑问jsfiddle.net的片段 - 克里希纳Krish