如何简化GitHub中多按键展示的<kbd>标签写法，避免重复编写开闭标签

针对GitHub平台的两种实现方案，分使用场景选择： #

场景1：用在README、Issue、PR评论等普通GitHub Markdown环境

该环境下GitHub会过滤自定义CSS、自定义标签，没有原生的简写语法，你可以用编辑器批量操作减少重复编码：

• 先写纯文本按键序列，用空格分隔内容：↑ ↑ ↓ ↓ ← → ← → B A
• 用编辑器的多选功能批量加标签：以VS Code为例，选中内容里的空格，按Ctrl+D（Windows/Linux）/Cmd+D（Mac）选中所有空格，输入</kbd> <kbd>，再在整段开头补<kbd>、结尾补</kbd>，几秒就能生成符合要求的完整代码，无需手动逐个编写标签。

场景2：用在GitHub Pages等支持自定义样式的页面

如果你是在自己搭建的GitHub Pages站点使用，可以通过自定义CSS简化写法：

1. 在全局样式文件中添加如下规则，匹配空格分隔的按键内容：

/* 实现和GitHub原生kbd一致的样式 */
.key-group kbd {
  padding: 2px 4px;
  border-radius: 3px;
  border: 1px solid #d1d9e0;
  background-color: #f6f8fa;
  font-family: ui-monospace, SFMono-Regular, monospace;
}

2. 后续写按键序列时仅需要一层父标签包裹即可：

<span class="key-group">↑ ↑ ↓ ↓ ← → ← → B A</span>

如果用Jekyll等静态生成器部署，还可以额外配置自定义短代码，进一步简化写法为类似{% kbd ↑ ↑ ↓ ↓ ← → ← → B A %}的形式，构建时会自动生成带标签的完整内容。

内容的提问来源于stack exchange，提问作者just-a-hriday