javascript - 我可以用纯 CSS2 做这个 "action"吗？

Question

我有this代码:

<ul class="main">
    <li>
        <a href="#">Link 1</a>                
    </li>                    

    <li>
        <a href="#">Link 2</a>
        <ul class="second">            
            <li>Hello</li>
        </ul>                        
    </li>                                
</ul>​

.second
{
    display:none;
}​

我想，当我将鼠标悬停在链接上时 (a:hover) 将 display:block 设置为 ul second 第一层的 li 里面。然后，当我用鼠标离开链接时，将其恢复为无。

是否可以使用 CSS 或仅使用 javascript？

Answer 1

当然可以

ul.second { display: none; }
a:hover + ul.second { display: block; }

它甚至可以在大多数现代浏览器中运行。

不确定 + 选择器是否属于 CSS2。