SCSS의 부모 선택자 우선 적용

상위 선택자를 SCSS 앞에 추가하여 선택자를 중첩 시키려합니다.SCSS의 부모 선택자 우선 적용

기본 선택기는 :

<div class="selector-class"> 
    <div class="selector-class__element"></div> 
</div>

(A) 여기서가 SCSS에서 원하는 결과 :

.selector-class { 
    .selector-class__element { 

    } 
}

(여기서

.selector-class .selector-class__element {}

는 HTML이고 B) 이것은 어떻게 내가 wan t는 그것을 할 수 있습니다 : 은 (작동하지 않습니다)

.selector-class { 
    &__element { 

    } 
}

(A)의 방법을 사용하는 것보다 그 일을 더 effecient 방법이 있나요?

2014-06-22 theorise

에 대한

.selector-class { &#{'__element'} { background: blue; } }

CSS

.selector-class .selector-class__element { background: blue; }

더 그래서 원하는 선택은 .selector 수준의 .selector-class__element''입니까? – cimmanon

예, 참으로 - 질문에 이것을 추가했습니다. – theorise

당신은 단지 시작에 추가 앰퍼샌드를 추가해야합니다

.selector-class { 
    & &__element { 
     background: red; 
    } 
}

2014-06-22 14:43:30 cimmanon

그러면 구문 오류가 발생합니다. 구문 오류 : \ "\t && \": \ \ {\ "{\"' – theorise

뒤에 CSS가 잘못되었습니다. Sass 버전 확인 : http://sassmeister.com/gist/447b34d92a304b206fc7 – cimmanon

Sass 3.3.8 (Maptastic Maple) – theorise

당신이 하나를 시도해야합니다. 이것은 클래스와 요소 모두에 대한 예제 일뿐입니다. 당신은 그들 중 하나를 시도 할 수 있습니다.

.selector-class { 
    &.class, &div { background: blue; } 
}

EDIT 다음은 문자열을 연결하는 보간 방법입니다. 보간

2014-06-22 14:50:54 Santosh

전체 내용은 전체'.class. '를 다시 쓰는 것을 피하는 것입니다. – theorise

& .class를 피하고 이동할 수 있습니다. ~ & # { '__ 요소'}. 도움이됩니까? – Santosh

& # { '__ element'}와 (과) 무슨 상관이 있는지 잘 모르겠습니다. – theorise

답변