汉堡菜单 · Hamburger Menu
英文：Hamburger Menu
导航与切换难度：入门 ★
🗣️一句话大白话
手机端右上角的三条横线按钮，点击后展开或滑出完整导航。手机端右上角常见的三条横线按钮，点击后展开或滑出完整导航。
🖼️样图参考
🎬真实场景
移动网站、小屏界面、极简导航、导航项较少的网站
📮你可以这样说
「Punk 网站在 768px 以下使用 Hamburger Menu， 右上角显示三条横线按钮，点击后从右侧滑出 Drawer， 包含 Home、Work、About、Writing 和 Contact； 打开后锁定背景滚动，支持 Esc 关闭、点击遮罩关闭和键盘焦点管理。」
通过 AI绘图 工作台生成（模型 API 额度由此消耗）；未配置模型密钥时会提示失败原因。
⚠️边界与常见误解
- ▸误解：汉堡菜单适合所有移动导航。实际导航项很少时直接平铺更好，汉堡隐藏导航降低发现性
🚫什么时候别用
- ✗导航项少于 3 个时（直接显示）
🧩常见变体
右侧滑出 Drawer下拉面板
🕸️知识关系图
这个词条与相关术语、AI绘图 知识的连接关系