一：页面结构：
二：页面样式css，放在head标签里
三：引入jquery文件
四：给一级菜单绑定点击事件，点击时展开下面的子菜单
五：给二级菜单绑定事件，点击时加入选中的深色背景
六：阻止二级菜单点击发生冒泡，当点击二级菜单的时候，一级菜单的事件也会发生，此时二级菜单会被收起，因此需要阻止事件冒泡
原文作者技术博客： https://www.jianshu.com/u/ac4daaeecdfe
95后前端妹子一枚，爱阅读，爱交友，将工作中遇到的问题记录在这里，希望给每一个看到的你能带来一点帮助。
欢迎留言交流
利用伪类可以实现点击打开折叠菜单，但是再次点击收起貌似就没法实现了。跟楼下说的一样，利用:hover、:active 可以设置二级菜单的样式（如height、visibility、display）以达到展开的效果。<h1><p>折叠1</p></h1><h1><p>折叠2</p></h1>
<h1><p>折叠3</p></h1>
<h1><p>折叠4</p></h1>
需要js来，最好用jquery来实现
只需要给h1绑定事件，单件它的时候，设置它的p属性，display:none。
