如何在VS Code中通过快捷键快速将HTML元素包裹进指定容器标签

兄弟，我太懂你这种手动折腾标签包裹的痛苦了！在VS Code里有两种超高效的方式，完全能满足你想要的「选中标签+快捷键一键包裹」需求，再也不用手动挪标签、调缩进了：

方法一：用VS Code自带的Emmet包裹功能（零配置直接用） #

• 选中你要包裹的HTML元素（不管是折叠的单个标签，还是一段代码块都可以）
• 按下 Ctrl+Shift+P（Windows/Linux）或者 Cmd+Shift+P（Mac）打开命令面板
• 在面板里输入 Emmet: Wrap with Abbreviation 并选中这个命令
• 输入你想要的包裹标签（比如div、b，甚至可以直接写带类名的div.card），回车就能自动完成包裹，缩进也会自动调整好！

方法二：自定义专属快捷键（一步到位更爽） #

如果你觉得每次打开命令面板太麻烦，可以给这个Emmet命令设置专属快捷键：

• 按下 Ctrl+K Ctrl+S（Windows/Linux）或者 Cmd+K Cmd+S（Mac）打开快捷键设置页面
• 在搜索框里输入 Emmet: Wrap with Abbreviation
• 点击命令旁边的铅笔图标，设置你想要的快捷键（比如你说的Ctrl+B对应<b>、Ctrl+D对应<div>）——注意别和VS Code已有的快捷键冲突就行！

另外提个小技巧：哪怕你只选中了标签的一部分，或者光标在标签内部，用这个方法也能精准包裹整个标签，完全省去你原来那些繁琐的手动操作步骤。

备注：内容来源于stack exchange，提问作者Simon Ferndriger