[sass] 기초 1편 : 셋팅 및 변수, 사칙연산

sass 셋팅하기

 

 

1. 비주얼 스튜디오 코드에서 5버전 이상으로 설치

 

 

2. sass 파일 만들기

파일명.scss

 

💡 웹브라우저는 .css만 읽을 수 있다.

scss → css 변환해야 사용 가능

 

 

3. 비주얼스튜디오 맨 밑에 Watch Sass 누르면 css로 변환되고

 

 

두가지 파일 생성됨

 

 

💡 .map파일의 용도 : 크롬에서 작업관리자 창에 css가 아니라 scss 파일로 분석해준다

 

 

 

변수 만들기

 

 

어려운 단어 기억해야할 땐 변수문법 사용 (변수는 데이터를 잠깐 보관하는 통)

$변수명 : 저장해서 쓸 코드;

 

ex) 자주쓰는 색상코드가 너무 어려워서 기언 안날때

$변수명 : 컬러코드; 

$변수이름 으로 불러와서 사용 가능하다.

 

 

 

사칙연산 가능

 

 

💡 사칙연산할 때

+, - 는 같은 단위끼리

* , / 는 정수만