先来看看效果图
首先默认显示的是爷爷,点击之后会先展开最下面一栏,然后出来上边的那部分,下面的兄弟五个是一个选项卡的效果,可以点击切换,点击右上角的关闭按钮就可以收回去,回到原来的样子,废话不多说,直接上代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>折叠菜单栏</title>
<style>
*{
margin:0;
padding: 0;
}
ul li {