[VScode] 추천 필수 퍼블리싱 확장프로그램 - HTML CSS

Auto Rename Tag

 

- Html에서 특정 태그를 변경할 경우 닫는 태그도 자동으로 변경됨

- 사용법 : 자동적용

 

CSS Peek

- Element에 어떤 스타일이 적용되었는지 확인할 수 있음

- 사용법 : class에 커서를 두고 ctrl + 마우스 클릭

 

HTML CSS Support

- CSS에 정의되어 있는 선택자(id, class)를 Html에 입력할 때 자동완성 

- 사용법 : id나 class 값 입력 위치에 커서를 두고 ctrl + space 

 

Live Sass Compiler

- SASS/SCSS 사용 시 css파일로 compile할때 양식이나 경로 등을 설정할 수 있음 

- 사용법 : 최초 setting.json을 설정하고 VScode 하단에 있는

버튼을 클릭해서 실행시켜두면 SASS, SCSS 파일 저장 시 자동 compile 됨

 

 

- live sass compiler 설정

2021.05.09 - [Dev/HTML CSS] - [VScode] 확장프로그램 - Live Sass Compiler 설정

 

 

 

Live Server

- 가상 로컬 서버 환경 구성 / 파일 수정 후 저장 시 자동 새로고침

- 사용법 : VScode 우측 하단

버튼 클릭 시 실행됨