html - 问题是，当鼠标悬停在链接上时会显示我的列表但无法点击它

Question

我是 CSS 新手，需要一些帮助... 我有一个嵌套 ListView 的示例...我想要的是，当我将鼠标悬停在链接上时，内部列表应该是可见的.....我是用 css 完成的，但问题是当我去点击内部列表的元素，它再次隐藏....看到这个http://jsfiddle.net/t7mdf/ 那么我如何保持内部列表可见直到指针位于内部列表上...

所以我在我的 CSS 样式中缺少什么......请给我建议...... 我的代码如下..

<ul class="main-menu">
<li>
    <a>First List</a>
    <ul class="sub-menu">
        <li>1</li>
        <li>2</li>
        <li>3</li>
    </ul>
</li>
<li>
    <a>Second List</a>
    <ul class="sub-menu">
        <li>4</li>
        <li>5</li>
        <li>6</li>
    </ul>
</li>
<li>
    <a>Third List</a>
    <ul class="sub-menu">
        <li>7</li>
        <li>8</li>
        <li>9</li>
    </ul>
</li>

CSS 是 .main-menu{list-style:none;} .子菜单{显示:无;} .main-menu a:hover + .sub-menu{display:block;}

Answer 1

再添加一段css代码:

.sub-menu:hover{display:block;}