Sass @for 루프에서 css3 미디어 쿼리 사용

Question

가능합니까?

예 :

@for $i from 1 through 12 { 
    @media screen and (min-width: #{$i * 240}) { 
    width: {$i * 240 + (20*($i-1)) } ; 
    } 
} 

하지만

Invalid CSS after "...nd (min-width: ": expected expression (e.g. 1px, bold), was "#{$i * 240}) { ..." 

Answer 1

당신은 위의 말대꾸 3.2과 미디어 쿼리에 변수를 사용할 수 있습니다 점점 ​​계속. 당신은 터미널에서이 프로그램을 실행하여 사용중인 버전을 찾을 수 있습니다 : 난 당신이뿐만 아니라 픽셀을 사용하는 방법을 찾고 있으리라 믿고있어

(sudo) gem install sass --pre 

을 : 당신은 실행하여 3.2 알파를 설치할 수 있습니다

gem list | grep sass 

당신이 3.2 이상이 설치되어 그래서 일단, 당신은 할 코드를 정리할 수 :

@for $i from 1 through 12 { 
    @media screen and (min-width: $i * 240px) { 
    width: $i * 240px + (20*($i - 1)); 
    } 
} 

공지 사항 대신 240의 240px과 공간 adde 곱하여 d 사이 $i - 1