主页 / computer / 问题 / 1781315
Accepted
Simon Ferndriger
Asked: 2023-04-28 16:41:05 +0800 CST

将 html 元素包装到容器标记中的 Visual Studio Code 快捷方式

  • 772

当您有一个 HTML 标记并且想将它包装到另一个 html 标记中时，最快/最简单的方法是什么？由于它经常发生，我正在寻找一种优化它的方法。

目前，它涉及以下步骤：

  1. 在原始标签之前创建新的 html 标签
  2. 在原始标签的末尾移动（自动生成的）结束标签
  3. 选择原始标签（可能需要滚动页面）
  4. 调整插入标签的缩进
  5. （终于完成了...

我正在寻找这样的东西：

  1. 选择一个（折叠的）html 标签
  2. 按一些快捷方式（例如“CTRL + b”表示<b>，“CTRL + d”表示<div>“）将其包装到特定标签中
keyboard-shortcuts

1 个回答

  1. Best Answer

    我不知道是否有一个扩展程序可以完成您的确切 2 个步骤，但这是在 3 中完成的一种非常好的方法：

    1. 选择一个 HTML 标签，折叠与否 - 无关紧要。
    2. 按热键editor.emmet.action.wrapWithAbbreviation命令。默认情况下它是未设置的，所以你需要配置它。
    3. 输入将包装您选择的内容的标签。

    也许可以借助代码片段来分两步完成。您可以为不同的标签创建一堆代码片段，例如：

    "Wrap with div": {
    "scope": "html",
    "prefix": "wrap",
    "body": "<div>$TM_SELECTED_TEXT</div>"
}

    然后创建一堆热键宏，用于首先选择整个标签（例如editor.emmet.action.balanceOut），然后调用您的每个片段调用 witheditor.action.insertSnippet和这些args：{ "name": "Wrap with div" }。有关定义宏的示例，请参见此答案。

    • 1

相关问题