[SASS/SCSS] 변수 ($선언)

 

| 변수

- 자주 반복되는 색상, 서체, 배경 등을 일괄 처리 가능하게끔 변수로 지정

- 변수 선언은 앞에 $ 를 붙여준다.

- 유지보수가 쉽다.

 

ex)

사이트의 포인트 색상이 #CD6799 가 변경될 경우, 모든 색상을 검색하여 변경해야되는 불편함이 있었음

> 변수로 지정 시, 변수에 색상코드만 변경

 

//변수 선언
$color-point: #CD6799;

// 사용방법 예시
button{
  padding: 8px 10px;
  border: 1px solid $color-point;
  background-color: $color-point;
  color: #ffffff;
}
strong{
  color: $color-point;
}