Html CSS-悬停影响两个div

我是CSS的新手。我有两个div，

div1

和

div2

div2

位于

div1

内部，悬停在

div1

上方，圆圈根据我的要求转换为蓝色背景

我在

div2

中有一个字母“F”。现在，将鼠标悬停在

div1

上，背景色变为蓝色，我希望

div2

中的“F”变为白色

---

我该怎么做呢？

根据您的要求-

HTML:

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

#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;
}

[编辑]

根据您的以下评论：

这是我怀疑的一个片段——克里希纳·克里什

---

根据您的要求-

HTML:

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

#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;
}

[编辑]

根据您的以下评论：

这是我怀疑的一个片段——克里希纳·克里什

---

您至少需要包含标记和css。很难说出你想要实现什么，尤其是因为你提到了一个圆，我不知道它与上面提到的两个div有什么关系。请用它来演示你的代码。它并不完美，但试试这个-我认为文本也需要变成白色，@MaryMelody，所以我稍微修改了你的提琴：@KrishnaKrish试试这个演示-你至少需要包含你的标记和css。很难说出你想要实现什么，尤其是因为你提到了一个圆，我不知道它与上面提到的两个div有什么关系。请用它来演示你的代码。它并不完美，但试试这个-我认为文本也需要变成白色，@MaryMelody，所以我稍微修改了你的小提琴：@KrishnaKrish试试这个演示-@chipChocolate.py谢谢！…）谢谢，它帮了我解决了一个我也遇到过的问题@chipChocolate.py谢谢！…：）谢谢，它帮了我解决了一个我也遇到过的问题！