scss2 SCSS 설치와 기본 세팅 [VSCode] SCSS 설치 및 기본 세팅 안녕하세요 오늘은 평소 사용하던 CSS가 아닌 SCSS를 설치후 기본 세팅에 대해서 알려드리겠습니다. 1. VSCode 확장 프로그램에 들어가서 Sass를 검색후 설치해 줍니다. 2. VSCode 확장 프로그램에 들어가서 Live Sass Compiler도 검색후 설치해 줍니다. 3. 아래쪽을 보셔서 Watch Sass가 나온다면 설치가 잘 된겁니다! 4. SCSS파일로 만드셔서 작성하시면 끝! VSCode는 SCSS를 사용 할수 없기 때문에 CSS로 컴파일 하신 후 사용하셔야한다는점! SCSS파일을 저장하면 자동으로 CSS파일로 컴파일 할 수 있는 방법도 있습니다!. 1. F1을 누른 후 Preferences:open user settings(JSON) 을 .. 2022. 9. 19. CSS - SCSS SCSS Sass(SCSS)란 CSS pre-processor로서, 복잡한 작업을 쉽게 할 수 있게 해주고, 코드의 재활용성 및 가독성을 높여주어 유지보수를 쉽게 해준다. CSS, SCSS의 차이점 SCSS 와 CSS의 차이점에는 CSS는 id,class로 스타일을 선언해 css에 넣어주는 반면에 SCSS는 $기호를 사용해서 직접 변수를 만든뒤 넣습니다. 예시로 확인하겠습니다. body { font: 100% Helvetica, sans-serif; color: #333; } 위의 표현이 CSS에서 사용하는 기본 표현이라면 SCSS에서는 변수를 선언해 아래쪽처럼 표현할 수 있습니다. $font-stack: Helvetica, sans-serif; $primary-color: #333; body { fon.. 2022. 8. 18. 이전 1 다음