如何在Visual Studio中使用HTML标记包装选区?

时间:2008-10-10 14:08:13

标签: visual-studio

这似乎是世界上最基本的问题,但是如果我能找到答案那该死的。

是否有一个键盘快捷键,无论是Visual Studio原生还是Code Rush或其他第三方插件,都可以用HTML标签包装当前选择?我已经厌倦了输入开始标记,将错位的结束标记切换到剪贴板,移动光标,并将其粘贴到它所属的末尾。

更新: This is how TextMate handles surrounding a selection with a tag。坦率地说,我惊讶于Visual Studio似乎没有类似的功能。为我可能想要使用的每个可想到的标签创建一个宏或片段似乎很荒谬。

9 个答案:

答案 0 :(得分:114)

Visual Studio 2015附带了一个新的快捷键Shift + Alt + W,它使用div包装当前选择。此快捷方式使文本“div”处于选中状态,使其可以无缝更改为任何所需的标记。这与自动结束标签更换相结合,可实现快速解决方案。

更新

此快捷方式也可在Visual Studio 2017中使用,但您必须安装“ASP.NET和Web开发”工作负载。

实施例

Shift+Alt+W > p > Enter

答案 1 :(得分:64)

我知道这已经过时了,你现在可能已经找到了答案,但我想补充一点,为了那些可能不知道在VS 2010中可行的人:

  1. 选择您要包围的代码。
  2. 执行ctrl-k ctrl-s(或右键单击并选择Surround with...
  3. 有多种HTML代码段可供选择。
  4. 如果找不到您要找的内容,您可以创建自己的SurroundsWith片段:

    1. 点击File,然后点击New,然后选择XML的文件类型。
    2. File菜单上,点击Save
    3. Save as框中,选择All Files (*.*)
    4. File name框中,输入文件名扩展名为.snippet的文件名。
    5. 点击Save
    6. 在XML文件中输入类似以下示例的内容:

      <CodeSnippet Format="1.1.0" xmlns="http://schemas.microsoft.com/VisualStudio/2005/CodeSnippet">
        <Header>
          <Title>ul-div</Title>
          <Author>Microsoft Corporation</Author>
          <Shortcut>ul>li</Shortcut>
          <Description>Wrap in a ul and then an li</Description>
          <SnippetTypes>
            <SnippetType>Expansion</SnippetType>
            <SnippetType>SurroundsWith</SnippetType>
          </SnippetTypes>
        </Header>
        <Snippet>
          <Declarations>
            <Literal>
              <ID>selected</ID>
              <ToolTip>content</ToolTip>
              <Default>content</Default>
            </Literal>
          </Declarations>
          <Code Language="html"><![CDATA[<ul><li>$selected$</li></ul>$end$]]></Code>
        </Snippet>
      </CodeSnippet>
      
      1. 打开Tools&gt; Code Snippets Manager
      2. 点击Import并浏览到刚刚创建的代码段。
      3. 选中My HTML Snippets,然后点击Finish,然后点击OK
      4. 然后,您将拥有闪亮的新HTML代码段,用于包装内容!

答案 2 :(得分:45)

Ctrl-X - &gt;类型标签 - &gt; Ctrl-V仍然是我在这个答案中提到的最快的解决方案:https://stackoverflow.com/a/5109994/486325

答案 3 :(得分:41)

如果您安装了Web Essentials,则可以use Shift+Alt+W用标签围绕选区。

答案 4 :(得分:8)

我知道这是一个古老的主题,但我遇到了这个问题,我终于完成了自己的问题,因为这是谷歌的第一个结果之一,我认为人们可能会觉得这很有用。

实际上它很简单,我只是从现有的HTML代码段复制并移动文字。以下代码段将包含一个通用的HTML标记,它会提示输入标记,并将其放在开始和结束标记中。

<CodeSnippet Format="1.1.0" xmlns="http://schemas.microsoft.com/VisualStudio/2005/CodeSnippet">
  <!-- Generic HTML Snippet -->
  <Header>
    <Title>Html</Title>
    <Author>Liam Slater</Author>
    <Shortcut>h</Shortcut>
    <Description>Markup snippet for HTML</Description>
    <SnippetTypes>
      <SnippetType>SurroundsWith</SnippetType>
    </SnippetTypes>
  </Header>
  <Snippet>
    <Declarations>
      <Literal>
        <ID>tag</ID>
        <ToolTip>tag</ToolTip>
        <Default></Default>
      </Literal>
      <Literal>
        <ID>selected</ID>
        <ToolTip>content</ToolTip>
        <Default>content</Default>
      </Literal>
    </Declarations>
    <Code Language="html"><![CDATA[<$tag$>$selected$</$tag$>$end$]]></Code>
  </Snippet>
</CodeSnippet>

答案 5 :(得分:7)

遇到这种情况时,我经常先输入结束标签,然后输入开始标签。这可以防止IDE通过在我不想要的地方插入结束标记来“帮助”。不过,我也对更好的解决方案感兴趣。

答案 6 :(得分:5)

对于使用Visual Studio 2017的用户:右键单击html / cshtml区域,或选择要包装的元素,列表中有一个Wrap With <div>按钮。 enter image description here

答案 7 :(得分:2)

我没有意识到任何事情,但写一个宏来将它包装成你想要的任何标签应该不难。我有一个类似的将我的选择包装在区域块中。

答案 8 :(得分:0)

我知道这是一个古老的问题,但是我只是在为同一件事而苦苦挣扎。您可以安装AndrésGutiérrez的Emmet Keybindings扩展程序。安装后,您可以突出显示文本,然后使用Control + MW包裹所需的任何标签。要为每行添加一个开始和结束标签,请在标签后加上*。