SCSS 사용 가이드

[devdeun]

SCSS 사용 가이드

변수 사용 방법

$변수명 형식으로 사용

.header {
  background-color: $color-gray-200;
}

mixins 사용 방법

@include 이름 형식으로 사용

.container {
  // 반응형 스타일링
  @include mobile { 
    padding: 0 10px;
  }
  
  @include tablet-md {
    padding: 0 20px;
  }

  @include desktop {
    padding: 0 40px;
  }
}

functions 사용 방법

• zIndex 함수
  • zIndex(레이어명) 형식으로 사용

.header {
   z-index: zIndex(header); // 100
}