如何从链接中的链接下拉下单击HTML和CSS

Question

我正在尝试使用html＆amp;仅CSS。我的页面上是一组链接/按钮（任何人都会这样做）。当我单击它们时，我希望出现一个3级下拉菜单。因此，当我单击它们时，所有链接都将具有此功能。

我知道如何使用jQuery做到这一点，但是我想知道如何使用html＆amp;仅CSS。

谢谢！

Answer 1

尝试以下操作：纯CSS下拉

您可以使用：悬停来绘制列表项目或其他部门。

Answer 2

尝试我的简单懒惰方式，

<style>
.container{
        display: block;
        height: 20px;
        overflow: hidden;
        width: 300px;
    background: yellow;
}
.container:hover{
overflow:visible;
    height: 300px;
}
.main ul li{
    display:none;
}
</style>
    <div class="container">
<a class="main" href="javascript:void(0)">menu</a>
<ul>
        <li><a href="javascript:void(0)">sub menu1</a></li>
        <li><a href="javascript:void(0)">sub menu2</a></li>
        <li><a href="javascript:void(0)">sub menu3</a></li>
        <li><a href="javascript:void(0)">sub menu4</a></li>
    </ul>
</div>

http://jsfiddle.net/87vls/3/