Html 纯CSS下拉菜单问题

很简单，很快，试图学习上面的代码，但迷路了。i、 e清单4中的链接或w/e将它们调用到您的菜单可以很好地使用响应式下拉菜单，但如果我做得更多，5-6等，它们不会出现在下拉菜单中，怎么了

/*标题*/ .标题{ 背景色：fff； 盒影：1px 1px 4px 0 rgba0,0,0,1； 位置：固定； 宽度：100%； z指数：3； } .标题ul{ 保证金：0； 填充：0； 列表样式：无； 溢出：隐藏； 背景色：fff； } 李安{ 显示：块； 填充：20px 20px； 右边框：1px实心F4； 文字装饰：无； } .头李a：悬停， .标题.菜单btn:悬停{ 背景色：F4； } .标题.徽标{ 显示：块； 浮动：左； 字号：2em； 填充：10px 20px； 文字装饰：无； } /*菜单*/ .标题.菜单{ 明确：两者皆有； 最大高度：0； 过渡：最大高度。2秒放松； } /*菜单图标*/ .标题.菜单图标{ 光标：指针； 显示：内联块； 浮动：对； 填充：28px 20px； 位置：相对位置； 用户选择：无； } .标题.菜单图标.导航图标{ 背景：333人； 显示：块； 高度：2倍； 位置：相对位置； 过渡：背景。2放松； 宽度：18px； } .标题.菜单图标.导航图标：之前， .标题.菜单图标.导航图标：之后{ 背景：333人； 内容：； 显示：块； 身高：100%； 位置：绝对位置； 过渡：所有。2放松； 宽度：100%； } .标题.菜单图标.导航图标：之前{ 顶部：5px； } .标题.菜单图标.导航图标：之后{ 顶部：-5px； } /*菜单btn*/ .标题.菜单btn{ 显示：无； } .header.menu btn:选中~.menu{ 最大高度：240px； } .header.menu btn:选中~.menu图标.navicon{ 背景：透明； } .header.menu btn:选中~.菜单图标.navicon:之前{ 变换：旋转-45度； } .header.menu btn:选中~.菜单图标.navicon:之后{ 变换：旋转45度； } .header.menu btn:checked~。菜单图标：not.steps.navicon:before， .header.menu btn:checked~。菜单图标：not.steps.navicon:after{ 排名：0； } /*48em=768px*/ @媒体最小宽度：48em{ 李局长{ 浮动：左； } 李安{ 填充：20px 30px； } .标题.菜单{ 明确：无； 浮动：对； 最大高度：无； } .标题.菜单图标{ 显示：无； } }

---

更改或编辑此类：

.header .menu-btn:checked ~ .menu {
  max-height: 240px;
}

---

现在它可以防止您的下拉菜单超过240像素。

删除最大高度：0

/* menu */

.header .menu {
clear: both;
*max-height: 0;*
transition: max-height .2s ease-out;
}

---

小提琴CSS的第93行。菜单的最大高度为240px；显然，如果你改变这一行，它将自动下降而不点击按钮。header.menu btn:checked~.menu{max height:240px；}有问题，这要感谢上面的答案：