如何制作应用于div的CSS规则会影响另一个div？

Question

是否可以在CSS中进行以下操作:

#subMenue {
//this rule apply to a div with an id of "subMenue"
height: auto;
width: 113px;
position: absolute;
background-color: #B3B3B3;
visibility: hidden;
}
#menueLink:hover {
//this rule apply to another div with an id of "menueLink"
//make the div that is effected by *#subMenue* rule change its visibility to *visible*
}

我正在尝试使用CSS制作基本的子菜单,而不使用JavaScript,并且复杂性最小.

Answer 1

你不能用CSS做你想做的事.也就是说,你可以使用下面的CSS菜单:

HTML:

<ul id="nav">
    <li>
        <a href="">Main Item 1</a>
        <ul>
            <li>Sub item 1</li>
            <li>Sub item 1</li>
        </ul>
    </li>
</ul>

CSS:

#nav > li ul { display: none; }
#nav > li:hover ul { display: block; }

您可以根据需要调整absolute子定位子菜单