[scss] @for (through / to)

@for through

@for $index from 1 through 3

• through 숫자까지 반복
  * 1부터 3까지 반복

/* scss */
@for $index from 1 through 3 {
	.through:nth-of-type(#{$index}){
    	width: 20px * $index;
    }
}

/* css 변환 결과 */
.through:nth-of-type(1){width:20px}
.through:nth-of-type(2){width:40px}
.through:nth-of-type(3){width:60px}

@for to

@for $index from 1 to 3

• to 바로 앞 숫자까지만 반복
  * 1부터 2까지 반복

/* scss */
@for $index to 1 to 3 {
	.to:nth-of-type(#{$index}){
    	width: 20px * $index;
    }
}

/* css 변환 결과 */
.to:nth-of-type(1){width:20px}
.to:nth-of-type(2){width:40px}