2012-03-28 2 views
1

보간 (Saas 3)을 사용하여 속성에 액세스하려하지만 오류가 발생합니다.새시 보간 문제

@each $icons in myPic1, myPic2 { 
     [data-type=#{$icons}] span { 
     background: url("/path/to/#{$buttons}.png") no-repeat scroll 50% 50%;} 
    } 

간부 오류 : 오류 : (말대꾸) : 96 : 후 잘못된 CSS 명령은 실패 "[... 데이터 형 ="예상 식별자 또는 문자열을 "# {$ 아이콘}했습니다] 스팬 { "(Sass : SyntaxError)

이 경우 어떻게 속성에 액세스 할 수 있습니까? 큰 따옴표로 보간을 둘러싸고 경우

답변

3

이 작동합니다

@each $icons in myPic1, myPic2 { 
    [data-type="#{$icons}"] span { 
    background: url("/path/to/#{$buttons}.png") no-repeat scroll 50% 50%;} 
} 

나는 이유를 모르겠어요. CSS에서는 문자열을 따옴표로 묶거나 따옴표로 묶을 수 있습니다. this interesting article about quotes in strings in CSS에서 볼 수 있듯이 :

So, a valid unquoted attribute value in CSS is any string of text that is not the empty string, consists of escaped characters and/or characters matching /[-_\u00A0-\u10FFFF]/ entirely, and doesn’t start with a digit or two hyphens or a hyphen followed by a digit.

그래서 사용중인 값은 따옴표없이 정확한 문자열입니다.

SASS는 따옴표 붙은 문자열과 인용하지 않은 문자열의 두 가지 유형을 모두 허용합니다. [data-type=myPic1][data-type="myPic2"] 모두 올바르게 컴파일됩니다. 그러나 어떤 이유로 보간을 사용하는 경우 반드시 보충해야합니다.

+1

SASS의 버그처럼 들리 겠지만, 아마도 버그 트랙커에게보고해야합니다 :) – sg3s

+0

Thanks! 작동합니다 –

+0

당신은 환영합니다 :) @ sg3s는 SASS 팀 –