순수 CSS에서 이미 선택된 요소의 마지막 요소를 선택하십시오

jquery :last 선택기와 같은 것을 원하지만 순수한 CSS가 필요합니다.순수 CSS에서 이미 선택된 요소의 마지막 요소를 선택하십시오

DOM 구조에서 색인을 모르면 'z'단락 을 어떻게 얻을 수 있습니까?. 또는 '.area'클래스의 마지막 자식을 얻는 방법은 무엇입니까? 이 부분은 CSS3 get last element으로 보이지만 부모 요소에 다른 하위 항목이 있기 때문에 제 경우에는 작동하지 않습니다.

p.area:last-child donesn't work!

얼마나 많은 요소가 클래스 .area과 함께 있을지를 알았을 때 해결책을 찾았습니다. 당신 캔트 자바 스크립트없이 그것을 할)

<div> 

<h1>This is a heading</h1> 
<p class="">The first paragraph.</p> 
<p class="area">The x paragraph.</p> 
<p class="area">The y paragraph.</p> 
<p class="area">The z paragraph.</p> 
<p class="">The last paragraph.</p> 

</div

출처

2013-08-15 user1842841

이 브라우저에서 어떤 브라우저가 작동 할 것으로 기대되는지 알고 있으면 좋을까요? IE8 +? –

이 질문보기 : http://stackoverflow.com/questions/7298057/css-last-child-selector-select-last-element-of-specific-class-not-last-child-i – Rooster

아시겠습니까? 지역 요소가 있습니까? – Danield

= p.area ~ p.area ~ p.area 을하지만 우리가 모르는 때 ... 나는 단지 재미를 위해 ... 생각 :

선택기는 다음과 같습니다. 여기 the W3C spec에서 인용은 다음과 같습니다 가 부모의 자식 목록에서 요소의 위치를 계산할 때

독립 텍스트 및 기타 비 요소 노드는 계산되지 않습니다.

의사 클래스는 결합 자나 id 또는 클래스와 같은 단순 선택자로는 타겟팅 할 수없는 대상 요소입니다. 이러한 유형의 의사 클래스를 "Structural Pseudo Classes"이라고합니다. 그들은 요소에 클래스가 있다는 사실을 무시하고 단순히 DOM을 사용하여 올바른 대상 요소를 결정합니다.

유일한 옵션은이 인스턴스에서 nth-child 또는 javascript를 사용한 명시 적 타겟팅입니다.

출처

2013-08-15 21:17:46

''가상 클래스는 클래스 나 ID가 아닌 요소를 대상으로합니다. '.area : last-of-type' ** [이 경우] (http://jsbin.com/iwotob/1/edit)로 절대 잘못되었습니다.) **, 'element'의 용어는 DOM의 선택자가 선택할 수있는 요소를 나타냅니다. @Chris의 대답 아래에 내 의견도 확인하십시오. –

틀렸어, 선택자를 사용하여 요소를 가져 왔습니다. 그 목록에있는 마지막 p입니다. 그 예제에 클래스가없는 또 다른 p를 추가하면 깨질 것이다. 또한 마지막 기사 요소 인 Chris의 대답에 대한 설명에서 요소를 찾기 위해 선택 도구를 다시 사용합니다. –

나도 알아,하지만 다시는이 문장은 '가짜 클래스는 클래스 나 ID가 아닌 요소를 대상으로한다.'고 강조했다. –

당신은 n 번째 자식을 사용해야합니다 (자세한 내용은 here 참조). 귀하의 경우에는 , 그것은해야한다 : 브라우저 지원에 대한

p.area:nth-child(5){ 
your style here; 
}

는 here을 찾습니다.

출처

2013-08-15 21:18:06 AdrianS

"DOM 구조에서 색인을 모르면" –

죄송합니다. 인용 한 문구는 굵게 표시되어 있지만 코드와 요청 만 보았습니다. 전체 설명을 읽지 않았습니다. :) – AdrianS

순수 CSS에서 이미 선택된 요소의 마지막 요소를 선택하십시오

답변

관련 문제