使用“Wrap with Abbreviation”功能可快速为选中文本添加HTML标签,先选中文本并按下Ctrl+Shift+G(或Cmd+Shift+G),输入如div、h2.title等缩写后回车,即可将文本包裹进对应标签。

在Sublime Text中给选中的文本快速添加HTML标签,可以通过内置命令和快捷键高效完成。这个操作特别适合对多段文字批量包裹div、p、span等标签,提升前端开发效率。
使用“Wrap with Abbreviation”功能
这是Sublime最实用的HTML标签包裹技巧,依赖于Emmet插件(默认已集成):
- 先选中需要包裹的文本
- 按下 Ctrl+Shift+G(Windows/Linux)或 Cmd+Shift+G(Mac)
- 输入HTML缩写,例如:div、ul>li*、section.container
- 回车后,选中文本就会被生成的标签包裹
比如选中“标题内容”,执行命令后输入 h2.title,结果会变成:标题内容
批量包裹多个选区的文本
当需要为多行或多块文本同时添加标签时,可以结合多光标与包裹功能:
立即学习“前端免费学习笔记(深入)”;
- 按住 Ctrl(或 Cmd)逐个选中文本
- 或使用 Ctrl+D 多次选择相同结构的文本
- 再执行 Ctrl+Shift+G,输入标签缩写
- 所有选中区域将同时被指定标签包裹
适用于批量处理列表项、卡片标题等重复结构。
自定义快捷键或使用菜单操作
如果快捷键不生效,可检查Emmet是否启用,或通过菜单操作:
- 顶部菜单选择 Emmet → Wrap with Abbreviation
- 也可在右键菜单中找到该选项
- 想修改快捷键,可在 Preferences → Key Bindings 中添加自定义键位
基本上就这些。熟练使用“Wrap with Abbreviation”,能极大加快HTML结构编写速度,尤其在处理静态页面或模板时非常实用。记得多尝试组合CSS类名缩写,效率更高。











