클래스 이름이 첫 번째 인접한 div의 CSS 스타일 만 설정하십시오.

클래스 "bla"가있는 첫 번째 div 만 스타일을 설정하려면 어떻게해야합니까? (두 번째가 아닙니다).클래스 이름이 첫 번째 인접한 div의 CSS 스타일 만 설정하십시오.

<div class="outer"> 
    <div> 
    ....(more div's, unknown how many) 
     <div class="bla"> 
     .... 
     <div class="bla">some content</div> 
     </div> 

    .... 
    </div> 
</div>

출처

2013-06-05 edbras

더 이상의 구조적 요구 사항이 없으면 불가능합니다. CSS는 문서의 구조 내에서 요소를 대상으로하는 규칙에 관한 것이며, 표시된 코드로는 대상을 지정하는 고유 한 방법이 없습니다. –

인접? 두 블래 블란은 형제입니까? 또는 당신이 제공 한 예제 에서처럼 다른 하나의 내부에 있습니까? – banzomaikaka

포함 된 div ("더 많은 div, 알 수없는 얼마나 많은"에서 참조)는 예제에 따라 클래스가 없습니까? 아니면 우리가 이것을 추측 할 수 없는가? – n00dle

이에 대한 간단한 해결 방법을 수행 할 수 있습니다

.bla { 
    /* style here, example: */ 
    background-color: #f00; 
} 
.bla .bla { 
    /* negate the style, example: */ 
    background-color: transparent; 
}

나는 이것이 당신이 찾고 있던 무엇인가를 바란다.

출처

2013-06-05 22:32:22 n1xx1

정말로 내가 원하는 것은 아니지만, 아마도 css에서 가장 좋은 내기입니다. – edbras

JOPLOmacedo에서 유효한 답변을 제공했습니다. – Jonathan

자바 스크립트 :

getElementsByClass('bla')[0].style

편집 : JOPLOmacedo가 나는 또한 인스턴스에 대한 <h1> 태그에 이어 두 번째로 <p>을 선택하는 방법을 발견 한 CSS를 전용 (더 좋은) 대답

을 제공 :

h1 + p + p{ 
background: red; 
}

그냥 공유하고 싶다고 생각했습니다.

출처

2013-06-05 22:25:15 Jonathan

하하 실제로 게시 할 첫 번째 유효한 솔루션입니다. 그것은 진절머리 나는 해결책이지만 단지 진절머리 나는 문제이기 때문에 문제의 유일한 해결 방법 일뿐입니다. –

완벽하게 훌륭한 답을 내려 투표하는 것은 무엇입니까? – Jonathan

나는 downvote하지 않았지만 이해할 수있다. CSS 솔루션은 JS 솔루션이 아니라 질문 받는다. 하지만 내가 말했듯이, 가능한 유일한 해결 방법입니다. –

순수 CSS에 따르면 html 요소의 순서에 따라 선택할 수 없습니다. 사양 검색 (여기 : http://www.w3.org/TR/CSS2/selector.html). 주어진 셀렉터와 얼마나 많은 순서로 html 요소가 일치 하는지를 나타내는 것은 없습니다.

출처

2013-06-05 22:27:52 waldol1

나는이 대답을 가정하면 인접 요소는 형제 요소를 의미합니다. 부모 - 자식 요소를 언급했다면 N1xx1의 대답으로 가십시오. 즉 ...

CSS 선택기 만 사용하여 첫 번째 bla을 타겟팅 할 수 없습니다. 하지만 blas을 타겟팅 할 수 있습니다. 따라서 한 가지 방법은 첫 번째에만 원하는 스타일을 설정하는 것입니다. bla은 모두 blas입니다. 그런 다음 첫 번째 스타일 인 blas을 모두 타겟팅하여 해당 스타일을 재정의하십시오. 이렇게 :

.bla { 
    ...styles for the first bla.. 
} 

.bla ~ .bla { 
    ...override styles set on first bla that you dont want on the others 
}

두 개의 ".bla"사이의 틸드를 일반 형제 선택기라고합니다. 들어 본 적이 없다면 css selectors spec으로 향하십시오. 당신이 특별한 선택으로 그렇게 할 수 없기 때문에

출처

2013-06-05 22:30:39 banzomaikaka

멋지다는 것을 몰랐습니다! 당신의 대답을 Upvoted! – Jonathan

클래스 이름이 첫 번째 인접한 div의 CSS 스타일 만 설정하십시오.

답변

관련 문제