반응형
비슷한 파일을 여러 개 입력해야 할 때, 하드코드 대신에 사용할 수 있는 for문을 scss에서 사용해보자
@for 를 이용해서 변수 $i를 선언하고 무슨 숫자부터 무슨 숫자까지 적용할 것인지 입력한다
생각보다 간단하지만 데이터가 1부터 100까지 있을 때 매우 유용할 부분이다!
반응형
@for $i from 1 through 3 {
.slides:nth-child(#{$i}) {
background-image: url("../assets/poland_w#{$i}.jpg");
}
}
반응형
'Front-end' 카테고리의 다른 글
npm을 이용한 SCSS 설치 (0) | 2023.06.04 |
---|---|
Parcel-bundler 프로젝트 세팅 (0) | 2023.04.16 |