VSCODE 에서 유용한 Emmet: Balance (outward, inward) 기능 + Shortcut
VSCode 에서 HTML을 개발할때 코드양이 많아지면 태그를 아무리 들여쓰기를 잘해도 어디가 시작 태그인지 알기 어렵다.
이것을 바로 알수 있게 하는 것이 Emmet: 균형있게(바깥쪽으로) 라는 Balance(outward) 기능이다.
우선 Command + Shift + P 를 눌러서 바로가기 키 열기를 선택한다.
바로가기 키에서 balance를 입력하면 아래와 같이 나온다
우선 outward를 선택하여 핫키를 설정한다. CTRL + ALT + B
inward를 선택하여 핫키를 설정한다. CTRL + ALT + V
테스트 해보기
1) 새 파일을 만들어 아래 코드를 입력한다.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>My test page</title>
</head>
<body>
<img src="images/firefox-icon.png" alt="My test image">
</body>
</html>
3) CTRL + ALT + V 를 누르면 inward를 해본다. 아래와 같이 블럭이 표시된다.
이상입니다.
