.one
クラス( ) に「ホバー」機能を配置して、グレー.one :hover
に変更します。コンテナーdivにカーソルを合わせると、両方の s ( )background-color
が強調表示されることを期待しています。div
.two, .three
.one
ただし、それが行うことは、ネストされた 2 つdiv
の s ( .two
、.three
) を個別にホバーすることです。誰かがなぜそうなのか、そして div 全体を強調表示して.one
単一の灰色の div を作成するために私がしなければならないことを説明できますか?
以下は私が使用したCSSです。
.one {
width: 200px;
display: inline-block;
}
.two {
background-color: rgba(0, 51, 102, 1);
width: 50px;
height: 100px;
float: left;
}
.three {
background-color: rgba(0, 204, 204, 1);
width: 150px;
height: 100px;
float: right;
}
.one :hover {
background-color: rgba(153, 153, 153, 1);
}
<div class="one">
<div class="two">
</div>
<div class="three">
</div>
</div>