2012-08-31 1 views
6

나는 단계 카운터 표시하려면 다음 CSS를 사용하고 있습니다 :content css 속성에 총 요소 수를 표시 할 수 있습니까?

:before { 
    content: "step " counter(fieldsets); 
    counter-increment: fieldsets; 
    /* Some more css */ 
} 

를하지만과 같이뿐만 아니라 요소의 총 수를 표시 할 수 있다면 나는 궁금했다 :

:before { 
    content: "step " counter(fieldsets) " of " total_number_of_fieldsets; 
    counter-increment: fieldsets 
    /* Some more css */ 
} 

나는 그것을 순수한 CSS 해결책으로 생각한다.

답변

1

CSS의 total_number_of_fieldsets 개수를 계산하는 것이 다른 경우가 아니면 그럴 수 없습니다. 의사 요소가 더 이상 정말 사실이 아니다

+0

나는 이것의 가난한 하위 호환성을 알고 있고, 나는이 해결책이 매우 예쁘지 않다고 생각하지만, 내가하고 싶은 일을한다. 고마워! –

+0

그것은 IE8에서 작동하며 IE는 항상 최소한 : first-line 및 : : first-letter 의사 요소를 지원합니다. IE8 +와 IE9/10에 이르기까지': before'와': after'를 지원하기 시작한 것은 아닙니다. – BoltClock

0

CSS는 DOM을 검사하거나 변수를 사용할 수 없기 때문에이 정보를 가져올 수 없습니다.

+1

지원되지 않기 때문에,이 IE < 9 작동하지 않습니다

주 후 : http://jsfiddle.net/EawLA/

당신은 총을 표시 할 수 있습니다 :

이 바이올린을 참조하십시오 이제 카운터를 사용할 수 있으며, 사용자 정의 데이터 속성을 사용하여 "attr (data-total-steps);"의 "content (카운터)"단계를 수행 할 수도 있습니다. –

+0

감사합니다 Jasper, 모든 문서에서 "counter (pages)"의 "content": "Page"counter (page) "사용에 대해 말하고 있지만 제대로 작동하지는 못했습니다. 데이터 attr 사용을 고려하지 않았습니다. 덕분에 – TarranJones

관련 문제