<kbd>是HTML标准语义化内联标签，专用于表示用户需按下的物理按键或组合键，浏览器原生支持；_KBD非标准标签，不被识别，仅可能是某些工具的自定义语法糖。
什么是 _KBD 标签，浏览器是否原生支持？
_KBD 不是 HTML 标准标签，浏览器不会识别它——直接写 <_KBD>Ctrl+S</_KBD> 会被忽略或当成未知元素渲染为空白/内联容器。真正起作用的是标准的 <kbd> 标签，语义明确、可访问性好、默认有浏览器样式（如浅灰背景+圆角边框）。
如果你在某文档工具（如某些 Markdown 扩展、VuePress 插件或内部 CMS）里见过 _KBD，那只是自定义语法糖，最终仍需转换为 <kbd> 或带样式的 <span> 才能生效。
如何用 <kbd> 正确展示组合键（如 Ctrl+Shift+T）？
组合键不是简单拼字符串。浏览器和屏幕阅读器依赖嵌套结构表达“同时按下”关系，正确写法是每个修饰键（Ctrl、Shift）和主键（T）各自包裹在独立的 <kbd> 中，并用 <span> 或空格分隔（推荐后者，更简洁）：
<kbd>Ctrl</kbd><span>+</span><kbd>Shift</kbd><span>+</span><kbd>T</kbd>
常见错误写法：
-
<kbd>Ctrl+Shift+T</kbd>→ 整体被当做一个键名，失去语义和可访问性 -
<kbd>Ctrl</kbd><kbd>Shift</kbd><kbd>T</kbd>→ 缺少分隔符，视觉上粘连，读屏器可能连读成“CtrlShiftT”
需要动态生成快捷键时，JavaScript 怎么安全渲染？
别用 innerHTML 拼接字符串，尤其当键名来自用户输入或配置项时（比如从 JSON 配置读取 "shortcut": "Cmd+K"），必须做转义和结构化解析。
推荐做法：先按 + 分割键名，再逐个清洗并包裹：
function renderShortcut(shortcutStr) {
const keys = shortcutStr.split('+').map(k => k.trim());
return keys.map(k => `<kbd>${k.replace(/&/g, '&').replace(/</g, '<')}</kbd>`).join('+');
}
// 使用：element.innerHTML = renderShortcut('Cmd+K'); // → <kbd>Cmd</kbd>+<kbd>K</kbd>
注意点：
- 必须对
&和做 HTML 实体转义，否则 <code>Cmd&K或Alt<Tab>会破坏 DOM - 不建议用
document.createElement('kbd')手动 append，小片段用模板字符串更轻量 - 如果快捷键含空格（如
Alt Space），需约定分隔符统一用+，避免歧义
样式微调和跨平台键名适配（Windows/macOS）
<kbd> 默认样式较朴素，且不同系统对“命令键”叫法不同（Ctrl vs Cmd）。可用 CSS 调整外观，再结合 UA 检测或配置开关切换键名：
kbd {
padding: 2px 6px;
border-radius: 4px;
background: #f0f0f0;
font-family: ui-monospace, monospace;
}
适配逻辑示例：
const isMac = navigator.platform.toUpperCase().includes('MAC');
const cmdKey = isMac ? '⌘' : 'Ctrl';
// 渲染时：`<kbd>${cmdKey}</kbd>+<kbd>K</kbd>`
关键提醒：
- 别用图片或字体图标替代真实文本（如用
⌘字符没问题，但用 SVG 就丧失可复制性和读屏支持） - macOS 的
Cmd键符号⌘是 Unicode 字符，直接写进 HTML 安全；但旧版 Windows 可能显示为方块，需测试目标环境 - 如果项目需严格遵循 WCAG，所有快捷键应在相邻文本中说明用途（例如：“Ctrl+K：打开命令面板”）
最易被忽略的一点：快捷键文案一旦进入翻译流程，Ctrl/Cmd 这类键名通常不译，但 Shift、Enter 在部分语言中有本地化习惯（如德语用 ↵ 表示回车），需和本地化团队对齐规则。
