[visual-studio] Visual Studio에서 HTML 태그로 선택 항목을 래핑하려면 어떻게하나요?

이것은 세상에서 가장 기본적인 질문처럼 보이지만 답을 찾을 수 있다면 저주합니다.

Visual Studio의 기본 또는 Code Rush 또는 기타 타사 플러그인을 통해 현재 선택 항목을 HTML 태그로 래핑하는 바로 가기 키가 있습니까? 여는 태그를 입력하고, 잘못 배치 된 닫는 태그를 클립 보드로 자르고, 커서를 이동하고, 그것이 속한 끝에 붙여 넣는 것에 지쳤습니다.

업데이트 : 이것은 TextMate가 태그로 선택 영역을 처리하는 방법 입니다. 솔직히 Visual Studio에 비슷한 기능이없는 것 같아 놀랍습니다. 내가 사용하고 싶은 생각할 수있는 모든 태그에 대해 매크로 또는 스 니펫을 만드는 것은 터무니없는 것 같습니다.



답변

Visual Studio 2015에는 현재 선택 항목을 div로 래핑하는 새로운 바로 가기 Shift + Alt + W가 제공됩니다. 이 단축키는 텍스트 “div”를 선택된 상태로 두어 원하는 태그로 원활하게 변경할 수 있습니다. 이것은 자동 종료 태그 교체와 결합되어 빠른 솔루션을 제공합니다.

최신 정보

이 바로 가기는 Visual Studio 2017에서도 사용할 수 있지만 “ASP.NET 및 웹 개발”워크로드가 설치되어 있어야합니다.

Shift+Alt+W > p > Enter


답변

나는 이것이 오래되었다는 것을 알고 있으며 아마도 지금까지 답을 찾았지만 VS 2010에서 이것이 가능하다는 것을 모르는 사람들을 위해 추가하고 싶습니다.

  1. 둘러싸고 싶은 코드를 선택하십시오.
  2. 수행 ctrl-k ctrl-s(또는 마우스 오른쪽 버튼으로 클릭하고 Surround with....
  3. 선택할 수있는 다양한 HTML 스 니펫이 있습니다.

원하는 것을 찾지 못한 경우 자신 만의 SurroundsWith 스 니펫을 만들 수 있습니다.

  1. 를 클릭 File한 다음을 클릭 New하고 파일 형식을 선택합니다 XML.
  2. File메뉴를 클릭합니다 Save.
  3. 에서 Save as상자를 선택합니다 All Files (*.*).
  4. 에서 File name상자와 파일 이름을 입력 .snippet파일 이름 확장명을.
  5. 를 클릭하십시오 Save.

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> Code Snippets Manager.
  2. Import방금 만든 스 니펫을 클릭 하여 찾습니다.
  3. 확인 My HTML Snippets하고 클릭 Finish한 다음 OK.

그런 다음 내용을 래핑 할 수있는 새 HTML 스 니펫을 사용할 수 있습니다!


답변

Ctrl-X-> 태그 입력-> Ctrl-V는 https://stackoverflow.com/a/5109994/486325 에서 언급했듯이 여전히 가장 빠른 솔루션 입니다.


답변

당신이있는 경우 웹 필수가 설치, 당신은 할 수 Alt + W + Shift 키를 사용하여 태그와 함께 선택을 포위.


답변

나는 이것이 고대의 스레드라는 것을 알고 있지만 마침내 내 자신의 것을 만들려고 한 문제에 맞서고 이것이 Google의 첫 번째 결과 중 하나이기 때문에 사람들이 유용하다고 생각할 것이라고 생각했습니다.

사실 꽤 쉬웠습니다. 기존 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>


답변

이런 상황에 직면했을 때 저는 종종 닫는 태그를 먼저 입력 한 다음 여는 태그를 입력합니다. 이렇게하면 내가 원하지 않는 곳에 닫기 태그를 삽입하여 IDE가 “도움”을받지 못합니다. 그래도 더 나은 솔루션에 관심이 있습니다.


답변

Visual Studio 2017을 사용하는 경우 : html/ cshtml영역을 마우스 오른쪽 버튼으로 클릭 하거나 래핑 할 일부 요소를 선택 Wrap With <div>하면 목록에 버튼이 있습니다.
여기에 이미지 설명 입력