Question

我是CSS的新手。我有两个div，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;
}

<强> [EDITED]

根据您的以下评论： TRY THIS DEMO

以下是我怀疑的片段jsfiddle.net - Krishna Krish

CSS-HOVER影响两个div

1 个答案: