인텔리제이 활용2 - Emmet/Zen Coding

인텔리제이 활용2 - Emmet/Zen Coding

에밋(Emmit)은 독자적인 표기법으로 표준 HTML이나 CSS를 단축해 입력하는 방식으로, 이전 이름인 Zen Coding으로도 유명했다.

 

Emmet는 특정도구에 의존하지 않는 특징이 있어서 다양한 에디터나 IDE용 플러그인으로 제공된다. 젯브레인 IDE는 Emmet을 표준으로 지원하고 있어 별도 플러그인 설치 없이 Emmet 표기법을 작성하고 표기법 입력 후 Tab을 누르는 것만으로 해당 기능을 사용할 수 있다.

방대한 정보를 제공하는 공식치트시트(Cheat sheet)도 참고하면 도움이 된다. 아래는 간단한 Emmet 표기법의 작성예제.

생략 표기법	표기법 실행 후
hello	<div class="hello">|</div>
hello{Hello World}	<div class="hello">Hello World</div>|
a	<a href="|"></a>
a{Hello World}	<a href="|">Hello World</a>
a[href=http://kisspa.tistory.com][블로그]	<a href="http://kisspa.tistory.com">블로그</a>|
script:src	<script src="|"></script>
script[src=hello.js]	<script src="hello.js">|</script>
form:post	<form action="|" method="post"></form>
table+	<table> <tr> <td>|</td> </tr> </table>