CSS 선택기 문제 - 어린이 및 부모?

내 예제에서 맨 위 레벨 "메가 부모"만 선택할 수있는 방법이 궁금합니다.CSS 선택기 문제 - 어린이 및 부모?

<li class="page_item parent"><a href="#"> Mega Parent</a> 
     <ul class="children"> 
      <li class="page_item parent"><a href="#">Subparent</a> 
       <ul class="children"> 
        <li class="page_item"><a href="#">Child</a></li> 
       </ul> 
      </li> 
     </ul> 
    </li>

최상위 상위 항목 인 'Mega Parent'에만 예를 들어 싶습니다. 붉은 색. 이 문제를 해결하는 가장 좋은 방법은 무엇입니까?

출처

2011-03-12 matt

CSS를 보여줄 수 있습니까? –

가능한 복제 http://stackoverflow.com/questions/977883/selecting-only-first-level-elements-in-jquery –

@BrianFlanagan 완전히 다른 –

.page_item.parent > a { color: red; } 
.page_item.parent li > a { color: inherit; }

을 아니면 추가 스타일을 설정하여 megaparent의 요소에 추가 클래스를 추가 할 수 있습니다 .

출처

2011-03-12 19:03:33 Floern

CSS는 특정 값에 대해 상속을 사용하므로 상속을 무효화하려면 자손에 color을 수동으로 설정했을 수 있습니다.

는 설명은 여기를 참조하십시오 :이 같은 것을 사용할 수

http://dorward.me.uk/www/css/inheritance/

출처

2011-03-12 19:01:27

이 문제를 해결하는 동안 클래스를 정의 할 때 해결해야합니다. 당신이 그들을 정의 할 수 있다면, 난 그냥 당신이 모든 요소

.page_item.parent a{ color:red; } 

.page_item.parent ul.children .page_item.parent{ color:black;}

또는 기본 스타일의 다른 종류의에 적용되는 기본을 덮어 중첩 된 일에 대해 서로 다른 선택을 가고 싶어, 당신은 또한 단지를 추가 할 수 두 번째 선택자를 다른 정의로.

출처

2011-03-12 19:09:58 sEver

CSS 선택기 문제 - 어린이 및 부모?

답변

관련 문제