(CSS) 변수 사용하기

 

 

css를 작성하다 보면 특정 색상이나 폰트 사이즈를 반복해서 사용하는 경우가 많다.

 

이때 이 반복되는 부분을 변수를 선언해 사용하면 추후 수정에 용이하다. 

 

 

변수 선언

• : root :  root 클래스 안에 변수를 넣으면 html 문서 어디에서든 변수에 접근이 가능해 흔히 사용된다.
• --main-color : 변수명 앞에는 --를 붙인다.

:root {
	--main-color:#d61111;
}

 

 

 

변수 사용

변수 사용시에는 var() 안에 변수명을 적는다. 

div {
	background-color : var(--main-color);
}