使用 Emmet 在 Visual Studio Code 中包装 HTML 元素 [重复]

Posted 2023-02-21

【中文标题】使用 Emmet 在 Visual Studio Code 中包装 HTML 元素 [重复]

【英文标题】：Wrapping a HTML element in Visual Studio Code using Emmet [duplicate]

【发布时间】：2017-11-12 18:51:08

【问题描述】：

我正在使用 VSC 开发 html 页面。将 emmet 与 VSC 一起使用是一次很棒的体验，但我经常发现我必须用 div 包装一组元素，但必须在单行上使用 emmet，然后在结尾处剪切粘贴结束标记我要映射的元素集。

有什么方法可以使用 emmet 并自动将 emmet 的输出包裹在一组选定的元素周围？

【参考方案1】：

试试Emmet: Wrap with Abbreviation 命令：

【讨论】：

如果您需要用标签包装每一行，只需将 * 作为后缀添加到标签中。即： 1. 选择行 2. 选择 Emmet Wrap Individual Lines with Abbreviation 3. 输入命令“li*”

【参考方案2】：

最简单的方法是使用键绑定，您可以为此分配自己的键。 文件 > 首选项 > 键盘快捷键 > 编辑键绑定并分配您自己的

[ "key": "ctrl+shift+g", "command":"editor.emmet.action.wrapWithAbbreviation", "when": "editorTextFocus && !editorReadonly" ]