html - 悬停问题。 HTML 和 CSS

Question

问题:想法是在悬停时更改其内容颜色的 div。除了文本和图像( Sprite )颜色在不同点发生变化；悬停在“地址”div 上方的文本和“addressicon”div 上方的图像。有谁知道如何在悬停在“地址”div 上时让两者都发生变化。

HTML:

<section id="gallery">
    <div class="container" style="padding-top:40px;">

        <div class="address"><div class="title"><span>Address</span></div><br>
            <div class="addressicon"></div>
            <p><br>Address1<br>
            Address2<br>
            Address3<br>
            Area<br>
            City<br>
            PostCode
            </p>
        </div>

        <div style="width:33%;height:400px;display:inline-block;background-color:#000000"></div>
        <div style="width:33%;height:400px;display:inline-block;background-color:#000000"></div>

    </div>
  </section>

CSS:

.address {
width:33%;
height:400px;
display:inline-block;
background-color:#CCC;
color:#bcb7af;}

.address:hover {color:#000000;}

.address span {
color:#bcb7af;
align:center;
font-size:24px;
width:100%;}

.address:hover span {
color:#000000;}

.title {text-align:center;}

.addressicon {
background: url(../images/address.png) bottom;
width:202px;
height:130px;
margin: 0px auto;}

.addressicon:hover {
background-position: 0 0;}

非常感谢

问题已解决新 CSS:

.address > .addressicon {
    background: url(../images/address.png) bottom;}

.address:hover > .addressicon, {
    background-position: 0 0;}

Answer 1

.address:hover > .addressicon {
    color: SOMETHING;
}

永远不要让 div 为空。将   放入其中，以防止其出现愚蠢的行为。