1

我的目标是image Manager-icon.png#watch #background #manager #logo将图像悬停blue-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;
}

请注意一件事:您不需要编写整个 id 链。ID在整个网页中必须是唯一的,因此在 CSS 中引用它就足够了。你不必写这个

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

完全够了

#pointer {
    ...
}
于 2013-11-14T08:08:21.913 回答