2011-09-27 5 views
5
나는이하고 싶은

:SASS에서 특정 요소 유형의 부모 스타일을 지정할 수 있습니까?

.classname { 
    color: red 

    a& { 
    color: blue; 
    } 
} 

를하고로 컴파일하기 :

.classname { 
    color: red; 
} 

a.classname { 
    color: blue; 
} 

구문이를 지원할 수 있습니까? a&, #{a&} 및 나침반 기능 #{append-selector("a", "&")}을 사용해 보았지만 a &은 컴파일되지 않지만 a.classname이 아닌 a .classname에는 분명히 나타납니다.

답변

-1

SASS의 중첩 구문에서는 실제로 가능하지 않습니다. SASS reference :

내부 규칙은 외부 규칙의 선택자 내에서만 적용됩니다.

중첩 된 규칙은 가장 일반적인 CSS 구조 중 하나에 있기 때문에, 쓸 CSS의 descendent selectors 쉽게 구문 설탕입니다. 이런 종류의 규칙을 작성하기 위해 접근법을 사용하는 것이 좋지만, 구문이 설계 (정의)되어있는 것은 아닙니다.

+1

를 지원되지 않는 "할 수 있도록 설계된 것"이며 그가하려고하는 것은 ** 클래스 **, ** 속성 ** 또는 ** 의사 선택기 ** 대신 ** 태그 **를 사용하려고한다는 것입니다. '& .cool','& [href]','& : hover'는 모두 작동합니다,'a &'또는'& a'는 그렇지 않습니다. –

+0

@ bfred.it 무엇? 그리고 그것은 여전히 ​​가능하지 않습니다 - 그것은 downvote의 가치가 있습니까? – derekerdmann

+0

예, 죄송합니다. 그 중 절반은 부적합하고 관련성이없는 정보입니다. 그게 수정 된 경우 취소 un-unot 행복 해요 –

0

나는이 작업을 수행 할 수있는 다양한 옵션을 생각해 봤지만 "왜"와야 만 다시 올 수 있습니까? 유스 케이스 란 무엇이며, 왜 이것을해야하는지, 무엇을하고 싶은 것과 동일한 결과를 얻을 수있는 다른 것인가?

0

태그에 대한 해결책을 찾을 수 없었지만이 경우 &[href]을 사용할 수 있습니다. 이 느리다하지만 (일부 <a> 태그 링크하지 않을 수 있습니다.) 희망

곧 우리가 &:any-link (What's the :any-link pseudo-class for?)를 사용 할 수 있습니다 실제로 더 정확한입니다하지만, 사실 아직 브라우저에서 유일한 차이점 사이를

관련 문제