your programing

Sublime Text 2 태그에서 선택 줄 바꿈

lovepro 2020. 10. 11. 11:05
반응형

Sublime Text 2 태그에서 선택 줄 바꿈


ST2에서 일부 텍스트를 강조 표시하고 alt+ shift+ w(Windows)를 누르면 현재 선택 항목이 <p></p>태그로 래핑됩니다 . 그러나 포장 태그를 지정하는 방법 이 있습니까? 스팬이나 div로 래핑하고 싶을 수도 있습니다.


적어도 Mac 용 Sublime Text 3에서는 Emmet이 필요하지 않습니다.

Emmet 플러그인을 사용하거나 사용하지 않고 커서를 단어의 어딘가에 놓고를 통해 단어를 강조 표시 한 다음 ( )를 commandd누르고 현재 강조 표시된 기본 생성 태그 위에 원하는 요소 유형을 입력 합니다 .controlshiftwMenubar > Edit > Tag > Wrap Selection With Tagp

참고 : MS Windows에서 줄 바꿈 단축키는 altshiftw.

여기에 이미지 설명 입력

여기에 이미지 설명 입력

여기에 이미지 설명 입력


Emmet을 사용하여 래핑하려는 태그에 커서를 놓고 ctrl+ w(MacOS의 경우) 또는 Alt+ Shift+ W(Windows의 경우)를 누르면 래핑 할 태그 유형을 입력하는 상자가 나타납니다.


하나의 선

이것을 변환하려면

Lorem ipsum dolor sit amet.

이에

<div>Lorem ipsum dolor sit amet.</div>  

이 작업을 수행:

  • 텍스트를 선택하거나 CTRL+를 누릅니다 L(현재 줄이 선택됨).
  • ALT+ SHIFT+ 누르기W
  • 원하는 태그를 입력합니다 (기본 p 태그를 덮어 씁니다).

여러 줄

이것을 변환하려면

Item 1
Item 2
Item 3

이에

<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>

이 작업을 수행:

  • 텍스트를 선택하거나 CTRL+를 L여러 번 누릅니다.
  • CTRL+ SHIFT+를 누릅니다 L(한 줄에 하나씩 선택).
  • ALT+ SHIFT+ 누르기W
  • 원하는 태그를 입력합니다 (기본 p 태그를 덮어 씁니다).

SHIFT+를 사용하여 텍스트를 선택할 MOUSE RIGHT BUTTON수도 있으며이 경우 두 번째 단계를 건너 뛸 수 있습니다.

Emmet 사용

이것을 변환하려면

Item 1
Item 2
Item 3

이에

<nav>
  <ul class="nav">
    <li class="nav-item1"><a href="">Item 1</a></li>
    <li class="nav-item2"><a href="">Item 2</a></li>
    <li class="nav-item3"><a href="">Item 3</a></li>
  </ul>
</nav>

이 작업을 수행:

Note for Mac users:

ALT + SHIFT + W = CTRL + SHIFT + W

CTRL + SHIFT + L = CMD + SHIFT + L


Create a custom snippet, for example, to insert a span tag. Go to the app menu: Tools > New Snippet ..., and copy to the window the snippet below:

<snippet>
    <content><![CDATA[
<span style="color:#0000FF">$SELECTION$1</span>
]]></content>
    <!-- Optional: Set a tabTrigger to define how to trigger the snippet -->
    <tabTrigger>span</tabTrigger>
    <description>HTML - span - color - blue</description>
    <!-- Optional: Set a scope to limit where the snippet will trigger -->
    <scope>source.html</scope>
</snippet>

... then save the snippet to file with e.g. html-span--color name and bind that snippet to a key combination in Preferences > Key Bindings-User, creating a new key entry, for example:

{ "keys": ["alt+shift+c"], "command": "insert_snippet", "args": { "name": "Packages/User/html-span--color.sublime-snippet" } }

It is supposed that a location of the snippet is Packages/User/ directory.

Now select any text that you need to wrap in the span tag and press Alt+Shift+c or type 'span', press Tab, a cursor will be set to required position within the tag, just type your text.

I have successfully tested the snippet and key binding with Sublime Text 3 in Ubuntu Linux.


The answers are all good. Here is where key bindings are for customizing:

In Preference: Key Bindings - Default:

{ 
  "keys": ["ctrl+shift+w"], "command": "insert_snippet", 
  "args": { "name": "Packages/XML/long-tag.sublime-snippet" } 
}

If you have Emmet, the emmet version is

{ "keys": ["super+shift+w"], "command": "wrap_as_you_type"}

Edit them in Preferences: Key Bindings - User to your liking,


to make your life easy while you are in Sublime text3: type any of these(p, h1, div, header, footer, title...) and hit Tab for example if you want div Just type div and hit Tab


in ST2 type a tag without brackets and hit Tab. It will automatically give you open and closed tag


This system of inserting snippets is very cumbersome compared to the mechanism provided in Dreamweaver. In that case you build a snippet of any kind. It is stored in an in-RAM library and displayed in a directory-style structure. You declare whether the snippet is of type INSERT (at cursor position), or of type SPAN (span selected text). In the first case the entire snippet is inserted. In the second case the snippet is created with a "before" part and and an "after" part. Typically the "after" part is just the closing tag. To use INSERT HERE mode, you position the cursor, and double-click on the snippet in the library and it inserts it at cursor position. To use SPAN SELECTED TEXT mode, highlight the text you want, and double-click the snippet in the library. The selected text is surrounded by the "before" and "after" parts of the snippet. This is very intuitive, easy to use, and enables the user to build unlimited kinds of snippets which can span selected text. WOULD SOME VERY SMART PROGRAMMER PLEASE BUILD AN EXTENSION LIKE THIS FOR SUBLIME 3 ? Note: In comparison, Bracket Highlighter is a Sublime plugin with a wrapping function that would seem to have such functionality, but on close inspection it is way too cumbersome to use if you want to build an efficient snippet library on-the-fly. Thanks, Peter Rosti

참고 URL : https://stackoverflow.com/questions/17321319/sublime-text-2-wrapping-selection-in-tag

반응형