仅作语义声明，不渲染、无样式、不触发默认行为，必须配合 javascript 监听 contextmenu 事件并手动创建带样式的 dom（如 或 ）才能实现可交互右键菜单。
menu标签的type="context"不能定义样式
HTML <menu></menu> 标签的 type="context" 仅用于声明该菜单为上下文菜单（右键菜单），它本身不提供任何样式控制能力，浏览器也不会渲染它——它只是个语义容器，必须配合 JavaScript 才能显示。
常见错误是直接写 <menu type="context"><li>复制</li></menu> 然后期待它自动出现在右键菜单里，结果什么都不会发生。这是因为：type="context" 不触发默认行为，也不支持 CSS 伪类（如 ::context-menu）或直接样式绑定。
真正生效的上下文菜单必须用 JS + contextmenu 事件
要实现可交互、可样式的上下文菜单，得靠监听 contextmenu 事件，动态创建并定位一个 <div> 或 <code><ul></ul> 元素，再用 CSS 控制外观。
-
event.preventDefault()必须调用，否则会弹出浏览器原生右键菜单 - 菜单元素需用
position: absolute+left/top定位到鼠标坐标（推荐用event.clientX/event.clientY） - 菜单结构建议用
<ul></ul>而非<menu></menu>，兼容性和样式控制更可靠 - 记得在菜单外点击时销毁它（监听
document.click并移除节点）
menu[type="toolbar"] 是唯一支持样式且被广泛支持的 type 值
目前只有 type="toolbar" 在部分浏览器中保留了有限的默认样式（比如横向排列），但依然不推荐依赖它做 UI。现代开发中，<menu type="toolbar"></menu> 几乎等价于 <nav></nav> 或自定义 <div>，所有样式都得手动写 CSS。
<p>注意：<code>type="context" 和 type="toolbar" 都已被 HTML 标准标记为“过时（obsolete）”，W3C 明确建议用其他语义化元素替代。Chrome/Firefox 对 <menu></menu> 的支持仅限于解析，不提供额外渲染逻辑或 API。
将调研报告、方案对比、数据分析、需求梳理、会议纪要、设计说明、代码评审、学习笔记等任务产物输出为可在浏览器直接打开的单文件 HTML，替代 Markdown 作为最终交付物。Markdown 在信息密度、视觉清晰度和可分享性上已跟不上 AI 产物的丰富度，HTML 能同时承载排版、表格、SVG 等。
想快速实现带样式的右键菜单？别碰
直接放弃 <menu type="context"></menu>，改用轻量级方案：
- 用
<div class="context-menu"> 包裹菜单项，CSS 控制圆角、阴影、hover 背景等 <li>通过 <code>data-action属性绑定行为，避免内联onclick - 如果项目用 React/Vue，封装成组件时注意处理
ref定位和事件委托 - 移动端慎用：contextmenu 事件在 iOS Safari 和部分 Android 浏览器中不可靠，需降级为长按触发
真正容易被忽略的是：浏览器根本不读取 <menu type="context"></menu> 的内容来构建右键菜单，它不是 <select></select> 那种有默认 UI 的元素——这个认知偏差会让很多人卡在“写了却没反应”的死循环里。
