CSS에서 주어진 요소의 직접적인 하위 요소가 아닌 요소를 처리하려면 어떻게해야합니까?

Question

이 조각을 고려 : 어떻게 생각입니다

.container :not(div.myList) input[type="text"] { 
} 

:

<div class="container"> 
    <input type="text"> 
    <div class="myList"> 
    <input type="text"> 
    </div> 
</div> 

나는 다음과 같은 선택은 분명히 내가 잘못했다 myList에 직접 자녀하는 장치를 제외한 전체 텍스트 입력을 해결할 수 있다고 생각 그게? CSS에서도 가능합니까? 더 빠르게 작업하기 위해 만든 http://jsfiddle.net/C46tN/입니다.

감사합니다.

1) 당신은 수행 할 수 없습니다 :하지 (div.myList)

Answer 1

당신은이 문제가있다. not (.myList) 만 할 수 있습니다. 당신은 단지 div의이 클래스를 설정하면

.container :not(.myList) input[type="text"] { 
    border:2px solid #f00; 
} 

이 실제 문제가되지 않습니다 :

이 올바른 구문입니다.

2) 실제로이 규칙에서 말하는 것은 : myList 클래스가 아닌 요소의 자손 인 inouts, 즉 컨테이너의 descendatn입니다. 즉, 컨테이너의 직계 하위 항목은 선택하지 않습니다.