[브라켓(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 태그가 뭔가 여러번 바뀌는 부분이 있었죠.
그 부분은 그냥 단축키를 연타 하시면 동영상과 같은 효과를 얻으실 수 있습니다.
메뉴 라던지, 앞자리 전화번호 입력 양식폼 같은거 만들때 편하게 쓸 수 있는 기능이네요.
반응형
'에디터 > 브라켓 에디터(Brackets editor)' 카테고리의 다른 글
[브라켓(Brackets)/확장 기능] Brackets Synapse(FTP, SFTP 관리) (34) | 2015.11.05 |
---|---|
[브라켓(Brackets)/확장 기능] OneLiner(js 정리) (3) | 2015.11.05 |
[브라켓(Brackets)/확장 기능] CSSFier(빠르게 CSS 만들기) (4) | 2015.11.03 |
[브라켓(Brackets)/확장 기능] Tabs - Custom Working(작업 파일 리스트 가리기) (2) | 2015.11.02 |
[브라켓(Brackets)/확장 기능] Brackets File Icons(파일을 아이콘으로 표시) (0) | 2015.11.02 |