Html 如何使下拉菜单看起来像一个盒子？

我正在制作一个带有下拉菜单的菜单，我想将其显示为一个方框，但当我使用display:flex时，它会显示一个很长的列表

.dropbtn{ 背景色：4CAF50； 颜色：白色； 填充：16px； 字体大小：16px； 边界：无； 光标：指针； } .下拉列表{ 位置：相对位置； 显示：内联块； } .下拉内容{ 显示：无； 位置：绝对位置； 背景色：f9f9f9； 最小宽度：160px； 盒影：0px 8px 16px 0px rgba0,0,0,0.2； z指数：1； } .下拉内容a{ 颜色：黑色； 填充：12px 16px； 文字装饰：无； 显示：块； } .下拉列表内容a：悬停{ 背景色：F1F1 } .下拉：悬停.下拉内容{ 显示器：flex； } .dropdown:悬停.dropbtn{ 背景色：3e8e41； } 下拉列表 编辑为ul li，而不是基于评论的按钮

您可以执行类似的操作，如CSS中所述：

.dropbtn{ 背景色：4CAF50； 颜色：白色； 填充：16px； 字体大小：16px； 边界：无； 光标：指针； /*新的*/ 列表样式：无； 宽度：80px； 文本对齐：居中； } .下拉列表{ 位置：相对位置； 显示：内联块； /*新的*/ 宽度：100%； } .下拉内容{ 显示：无； 位置：绝对位置； 背景色：f9f9f9； 最小宽度：160px； 宽度：100%； 盒影：0px 8px 16px 0px rgba0,0,0,0.2； z指数：1； /*新的*/ 顶部：68px； } .下拉内容a{ 颜色：黑色； 填充：12px 16px； 文字装饰：无； 显示：块； } .下拉列表内容a：悬停{ 背景色：F1F1 } .下拉：悬停.下拉内容{ 显示器：flex； /*新的*/ 柔性流：柱包裹； 证明内容：中心； 对齐项目：居中； 高度：300px； } .dropdown:悬停.dropbtn{ 背景色：3e8e41； } /*子弹*/ a:以前{ 内容：○ ; } 下拉列表

---

如果我需要用一个按钮代替一个按钮来显示DeDebug？？？胡里奥，我在上面编辑过，但是为了以后的参考，请考虑把所有需要的东西放在原来的帖子里，谢谢。希望能对你有所帮助，我下次会后悔的。当我第一次提出问题的时候，我很急，不用说，如果答案对你有帮助，请考虑正确的，谢谢你，胡里奥。