SASS에서 변수

SASS 언어는 변수 사용을 허용합니다. 변수는 일부 데이터를 저장하고 코드의 필요한 곳에서 사용할 수 있는 컨테이너를 나타냅니다.

변수를 생성하려면 이름을 생각해내고 그 앞에 $ 기호를 붙입니다. 그런 다음 변수 이름 뒤에 콜론을 찍고 해당 변수의 값을 지정합니다. 예를 들어 이름이 var인 변수를 만들어 보겠습니다:

$var: 20px;

이제 이 변수를 속성 값으로 사용해 보겠습니다:

p {
	font-size: $var;
}

결과적으로 컴파일 후 CSS에서는 변수 대신 그 값이 대체됩니다:

p {
	font-size: 20px;
}

다음 코드의 컴파일 결과가 어떻게 될지 설명해 보세요:

$color: #000;

p {
	color: $color;
}