最稳最快的方式是使用Emmet的emmet_wrap_with_abbreviation命令：选中文本后按Ctrl+Shift+P输入“Wrap with Abbreviation”，回车输入合法缩写（如div.item或ul>li*3）即可自动包裹；支持自定义快捷键（如Ctrl+Alt+F绑定figure>figcaption），且必须确保文件语法为HTML模式。
Sublime 里批量给多行代码加 HTML 标签，最稳、最快、最不翻车的方式就一个：用 Emmet 的 emmet_wrap_with_abbreviation 命令，别手敲、别硬套多光标——除非你明确知道那几行要包成什么结构且不含嵌套。
怎么用快捷键直接包裹选中内容（HTML 场景）
这是日常重构或快速生成结构时最常用的操作。前提是已安装 Emmet（2026 年 Sublime Text 4 默认带，旧版需手动装）。
- 选中你要包裹的文本（可以是纯文本、多行代码、甚至已有标签）
- 按
Ctrl+Shift+P打开命令面板，输入Wrap with Abbreviation回车 - 输入合法 Emmet 缩写，比如：
div.item、ul>li*3、section>header+main+footer - 回车即完成包裹，光标自动落到新标签内部
注意：ul>li*3 这类缩写会把选中内容作为每一项的 innerText；而 div 这种单标签则整体包裹。别输 div class="x" —— Emmet 不认空格，得写成 div.x。
怎么配自定义快捷键一键包特定结构（如 figure/figcaption）
如果你高频使用某一种包裹组合（比如图片配说明文字），硬记命令太慢，直接绑定快捷键更省事。
立即学习“前端免费学习笔记（深入）”；
- 打开
Preferences → Key Bindings - 在右侧用户键位文件里加一行（JSON 格式）：
{
"keys": ["ctrl+alt+f"],
"command": "emmet_wrap_with_abbreviation",
"args": {"abbreviation": "figure>figcaption"}
}
保存后，选中文本按 Ctrl+Alt+F 就直接变成 <figure><figcaption>...</figcaption></figure>。关键点：abbreviation 值必须是合法 Emmet 语法，不能含中文、空格、引号；嵌套层级越深，越要提前验证缩写是否能正确展开（可先在空行试 Ctrl+E）。
为什么不用多光标手动加括号（常见踩坑点）
很多人想“我 Ctrl+Shift+L 分多行，前面加 <p>，后面加 </p>”，看似灵活，实则容易出错：
- 如果选中内容本身含换行或缩进，多光标对齐极易错位，导致闭合标签漏写或错行
- 无法处理嵌套结构（比如你想包成
<div><span>xxx</span></div>，手动加两层括号极易漏掉内层 - 不支持属性自动补全（
div.btn-primary自动转为<div class="btn-primary">，手敲得自己打引号和等号） - 无撤销保护——一旦多光标操作失误，恢复成本远高于 Emmet 一次失败重试
多光标适合简单、线性、无结构约束的操作（比如批量改变量名），但凡涉及标签语义或嵌套，优先走 Emmet。
CSS 场景下“包裹”其实是另一回事（别混淆）
标题说“写 CSS 超爽”，但要注意：Emmet 的 Wrap with Abbreviation 是 HTML 向的，它不生成 CSS 规则。你在 CSS 文件里选中一段声明，执行该命令，结果是生成 HTML 标签并把那段 CSS 当作文本塞进去——这显然不是你想要的。
- 真要在 CSS 中快速生成块结构，用 Emmet 缩写 +
Tab：比如输入.card>padding:12px+border:1px solid #eee再按Tab - 想把多行 CSS 属性“包裹”进某个选择器？那是“生成新规则”，不是“包裹已有内容”——得用
Ctrl+Shift+P输入Emmet: Insert Snippet或直接手敲选择器再缩进粘贴 - 若真需要把几行 CSS 声明临时包进注释，用
Ctrl+Shift+/，不是 Emmet
真正容易被忽略的是：Emmet 在不同语法模式下行为不同。确保当前文件右下角显示的是 HTML 或 CSS，而不是 Plain Text —— 否则缩写根本不会触发。
