2014-02-14 2 views
10

중첩 된 값을 : not selector에 넣을 수 있습니까? 예 :내부에 중첩 css : not() 선택자

:not(div > div) 

시도 할 때마다 작동하지 않는 것 같습니다. 아마 내가 알아 내지 못한 다른 방법을 사용해야 할 것입니까? 지금까지 볼 수있는 모든 예제에서이 선택기 내에서 하나의 값만 사용할 수 있습니다.

+0

'div> div div'가 당신이 찾고있는 대상이어야합니다 .. 맞습니까? –

답변

13

:not()은 한 번에 하나의 간단한 선택기 만 허용합니다. 이것은 Selectors 3 spec 언급된다

부정 가상 클래스, :not(X)하기, simple selector 인수로 (부정 가상 클래스 자체를 제외) 촬영 기능 표기법이다. 인수로 표시되지 않는 요소를 나타냅니다.

예제의 단순 선택기는 사용자가 가지고있는 두 개의 div 토큰이됩니다. 다른 단순 선택자에는 클래스 선택자, ID 선택자, 속성 선택자 및 의사 클래스가 포함됩니다. 하나 이상의 단순 선택자를 허용하지 않으며 > 또는 공백과 같은 결합자를 허용하지 않습니다. 정확하게 선택하기 위해 노력하고있는 요소에 따라

는 제외 할 수있는 방법이 없을 수도 div > div :

  • 만 스스로됩니다 div의 하위 요소를 선택합니다 하지 div를 대신를 사용

    div > :not(div) 
    
  • 만 부모가 A 원소 div하지 div 요소를 선택하려면이를 대신 사용 모든 다른 요소를 선택

당신이 그 자체로이 부정을 사용하려면

:not(div) > div 

는, 그럼 그냥 선택기를 사용하는 방법이 없습니다.

내가 생각할 수있는 다른 가능한 실용적인 해결 방법은 :not() 표현을 사용하지 않고 원하는 요소에 스타일을 적용한 다음 div > div에 대한 실행을 취소하는 것입니다. 이는 타겟팅하려는 모든 요소 집합에 적용됩니다. 단점은 모든 속성을 쉽게 재설정 할 수있는 것은 아니라는 점입니다.

:not(div > div)unlike the CSS version을 지원하는 jQuery를 사용하는 경우 선택기를 스크립트에 배치 할 수 있습니다. 예를 들어 jQuery에서 해당 요소에 클래스 이름을 적용한 다음 CSS에서 해당 클래스를 대상으로 지정할 수 있습니다.

+1

셀렉터에서 쉼표로 살 수 있다면': not (div), : not (div)> div'는'div>와 일치하지 않는 모든 것을 선택하려고 할 수 있습니다. – cHao

+0

@cHao : 지금 내게 그렇게 분명해 보입니다. 어떻게 그리워했는지 모르겠습니다. 감사! – BoltClock