[브라켓(Brackets)/확장 기능] HTML Wrapper(자동 목록 생성)

에디터/브라켓 에디터(Brackets editor) 2015. 11. 5. 02:01

728x90
반응형

이 확장 기능을 소개하는 제목을 봐선

젠코딩 이나 Emmet 으로 생각할 수 있을꺼 같습니다.


아래 첨부된 동영상을 봐주시면 좋겠습니다.



동영상에 아주 잘 나와있지만

한번 더 이야기 하면 이렇습니다.


이러한 마크업을 했다고 가정하면

menu1 부터 menu 5 까지 드래그 해서 단축키만 입력하면


1
2
3
4
5
6
7
<ul>
    menu1
    menu2
    menu3
    menu4
    menu5
</ul>
cs


자동으로 다음과 같이 됩니다.


1
2
3
4
5
6
7
<ul>
    <li>menu1</li>
    <li>menu2</li>
    <li>menu3</li>
    <li>menu4</li>
    <li>menu5</li>
</ul>
cs


영상을 보셔서 아시겠지만 목록태그인 ul 태그만 되는게 아니라

여러가지 태그들이 되네요.



설치.



HTML Wrapper 으로 검색합니다.






사용법.

사용법은 아주 간단합니다.

확장 기능을 설치 후

동영상에 나왔던 것처럼 해당되는 문구를 드래그 합니다.

그리고

WINDOW : 컨트롤 + 쉬프트 + E

OSX : CMD + 쉬프트 + E 


영상에 보면 select 아래 option 태그가 뭔가 여러번 바뀌는 부분이 있었죠.

그 부분은 그냥 단축키를 연타 하시면 동영상과 같은 효과를 얻으실 수 있습니다.


메뉴 라던지, 앞자리 전화번호 입력 양식폼 같은거 만들때 편하게 쓸 수 있는 기능이네요.

반응형