1

私の目的は、 で画像をホバリングしたときに を表示することimage Manager-icon.pngです。#watch #background #manager #logoblue-pointer.jpg#watch #background #manager #logo

私のHTMLとCSSを以下に示します。

<div id="watch">
<div id="background">
    <img src="image/watch.jpg" height=100%>
    <div id="manager">
        <div id="pointer">
            <a href="login.html">
                <img src="Image/blue-pointer.jpg" width=100%>
            </a>
        </div>              
        <div id="logo">
            <img src="Image/Manager-icon.png" width=100%>           
        </div>
    </div>
</div>
#watch #background #manager #pointer{
    position: absolute;
    width: 100%;
    left: 28%;
    top: 79%;
}
#watch #background #manager #pointer img:hover + #watch #background #manager #logo img{
    display: inline;
}

#watch #background #manager #logo{
    position: absolute;
    width: 100%;
    top:35%;
}

#watch #background #manager #logo img{
    display: none;
}
4

1 に答える 1

0

+sign は兄弟を参照するため、#pointer imgは の兄弟にさえ近くないため#logo img、何も起こりません。#pointer aの唯一のコンテンツが画像であり、の唯一のコンテンツがアンカーであると仮定すると、#pointer次のように CSS を実行できます。

#pointer:hover + #logo img {
    display: inline;
}

1 つのことに注意してください: この ID のチェーン全体を記述する必要はありません。IDWeb ページ全体で一意である必要があるため、CSS で参照するだけで十分です。これは書かなくていい

#watch #background #manager #pointer {
    ...
}

これで十分です

#pointer {
    ...
}
于 2013-11-14T08:08:21.913 に答える