CSS를 통해 형제를 어떻게 선택합니까?

<div class="wrapper"> 

    <script></script> 
    <script></script> 

    <ul class="cars"> 
     <li class="headline">My Cars</li> 
     <li>Ferrari</li> 
     <li>Hummer</li> 
    </ul> 

    <noscript></noscript> 
    <script></script> 
    <script></script> 

    <ul class="cars"> 
     <li class="headline">My Cars</li> 
     <li>Volvo</li> 
     <li>Caddilac</li> 
    </ul> 

    <noscript></noscript> 
    <script></script> 
    <script></script> 

    <ul> etc.... 

</div>

질문 : CSS 만 사용하여 첫 번째 부분을 제외한 모든 <li class="headline">My Cars</li> 요소를 숨길 수 있습니까?CSS를 통해 형제를 어떻게 선택합니까?

저는 어제 약간 비슷한 질문을했지만 어떨까요? 문제는 해결되었지만 시나리오가 변경되어 추가 문제가 발생했습니다. 나는 CSS를 제어 할 수있는 위치에 있으므로 JavaScript를 사용하거나 HTML을 수정하지 말 것을 제안하십시오.

어제의 해결책이 완전히 실패하게하는 요소는 <script>과 <noscript>입니다.

브라우저 호환성을 위해 솔루션에서 CSS3을 사용하지 않았 으면 좋겠습니다.

아이디어가 있으십니까?

출처

2011-05-04 Weblurk

왜 모든 태그가 '

li.headline { 
    display: none; 
}

그것은 모든 표준 브라우저에서 호환 (http://www.quirksmode.org/css/display.html 여기 호환성 참조) 먼저 ul에 first 클래스를 포함하십시오. 귀하의 HTML을 만질 수 없으면 내가 제시 할 수있는 CSS2 선택자가 없습니다.

그러나이 두 질문에 대한 답이 '예 경우

는 :

모든 li.headline들에만 ul 요소에있을 건가요?
은 div.wrapper 만 자식으로 script, noscript 또는 ul 요소 중 하나를 포함하는 것입니까?

그런 다음 CSS3 선택자와 함께 쉽게 : 당신의 정확한 HTML 구조 (<script> 요소의 첫 번째 세트 위의 <noscript>을 가지고 있지)와

.wrapper > ul:first-of-type ~ ul li.headline { 
    display: none; 
}

출처

2011-05-04 12:53:18 invalidsyntax

"첫 번째 것을 제외하고" – BoltClock

첫 번째 것을 표시하는 것이 다른 방법일까요? – blankabout

@BoltClock - 분명히 알 수 없습니다. 그래, CSS만으로는 HTML을 사용하여 수업을 변경하지 않는 한 혼자 할 수 없다. – invalidsyntax

이 작동합니다

.wrapper > noscript + script + script + .cars > .headline { 
    display: none 
}

너무 연약하기 때문에 나는 그것을 매우 싫어한다. 나는 오히려 저 혐오보다 JavaScript를 사용하고 싶습니다.

참조 :http://jsfiddle.net/davT8/

이 IE7 + 현대적인 브라우저에서 작동합니다.

출처

2011-05-04 13:24:10 thirtydot

CSS를 통해 형제를 어떻게 선택합니까?

관련 문제