** scss/_partial/functions.scss
** 2024.04
rem($px)
** 2024.05
- rem함수로 사용시 오류
- 원인 : sass/scss 공식 문서상에서 중지함.
- 이유는 사용자가 직접 만든 rem() 함수와 기존 rem() 함수가 충돌할 수 있어 중지함
- 사용자 정의 함수를 바꿈
- ppr($px)
- 의미 : pixel per rem
기본 _reset.scss 또는 _common.scss에서 기본 폰트 사이즈 정의
html {
font-size: 16px;
}
scss 파일 내의 단위에 ~~px 대신 ppr함수로 대체함
예1) font-size: 16px; ==> font-size: ppr(16);
=== css컴파일 결과 : font-size: 1rem;
예2) font-size: ppr(24); // 24px
=== css컴파일 결과 : font-size: 1.5rem;
** rem 단위일 떄 모바일에서 디바이스 사이즈별 대응에 강점이 있다.
'스타일시트 > SCSS' 카테고리의 다른 글
| 6. pixel & rem (0) | 2025.03.20 |
|---|---|
| 5. SCSS 기본 문법 - @mixin & @include (1) (0) | 2025.03.20 |
| 3. SCSS 기본 문법 (0) | 2025.03.20 |
| 2. SCSS 사용 방법 - Basic settings (0) | 2025.03.20 |
| 1. SCSS 사용 방법 - Live Sass Compiler settings (0) | 2025.03.20 |