Mixins의 사용 방법 중 하나이다.
정의한 mixin에 기존 코드를 옮기는 방법이다.
mixin에서의 코딩 문법과 활용하기에 적절하며, 반응형 웹을 위한 미디어 쿼리에도 활용할 수 있다.
메인 scss 파일에서 @include 와 mixin 이름 + 파라미터 를 선언하고, 그 안에 추가 속성을 넣어 선언한다.
mixin 파일에는 파라미터와 추가 속성 값이 넘어가게 된다.
추가 속성 값은 mixin 파일의 @content 부분에 해당한다.
이를 if else 등에 적절히 활용하여 media query를 사용하는 코드이다.
위 media query에 사용한 변수 값을 정확하지 않으므로, 추후 포스팅에서 자세하게 쓸 예정이다. (사용 금지)
이런 방식이 있다는 정도만 소개하는 포스팅이다.
참고)
https://nomadcoders.co/css-layout-masterclass/lectures/1396
'Front-end > SCSS' 카테고리의 다른 글
| SCSS) [Mixins] parameter 활용 방법 (0) | 2022.10.27 |
|---|---|
| SCSS) [Mixins / Extends] 기본 사용 방법 및 차이점 (0) | 2022.10.10 |
| SCSS) [Nesting / Variables] SCSS 사용 방법 및 변수 활용 + BEM (0) | 2022.10.10 |
| SCSS) 프로젝트 폴더에 SCSS 설치하기 ... Git clone 방식 (1) | 2022.10.07 |