예
방법이와 섹션과 하위 섹션을 숫자로 "Section 1" , "1.1" , "1.2" , 등 :
body
{
counter-reset: section;
}
h1
{
counter-reset: subsection;
}
h1:before
{
counter-increment: section;
content: "Section " counter(section) ". ";
}
h2:before
{
counter-increment: subsection;
content: counter(section) "." counter(subsection) " ";
}
»그것을 자신을 시도 정의 및 사용
카운터 - 증가 속성은 하나 이상의 카운터 값을 증가시킵니다.
카운터 - 증가 속성은 일반적으로 카운터 리셋 속성과 콘텐츠 속성과 함께 사용됩니다.
| 기본값: | none |
|---|---|
| 상속 : | no |
| 애니메이션 : | no. Read about animatable |
| 번역: | CSS2 |
| 자바 스크립트 구문 : | object .style.counterIncrement = "subsection"; Try it |
브라우저 지원
테이블의 숫자는 완전히 속성을 지원하는 최초의 브라우저 버전을 지정합니다.
| 재산 | |||||
|---|---|---|---|---|---|
| counter-increment | 4.0 | 8.0 | 2.0 | 3.1 | 9.6 |
Note: !의 IE8은 DOCTYPE이 지정된 경우에만 카운터 증가 속성을 지원합니다.
CSS 구문
counter-increment: none|id|initial|inherit;속성 값
| 값 | 기술 |
|---|---|
| none | 기본값. 어떤 카운터가 증가되지 않습니다 |
| id number | id 증가되어야하는 카운터를 정의합니다. number 카운터 선택기의 각각의 경우에 증가 얼마나 설정한다. 기본 증가가 1. 0 또는 음수 값이며, 사용할 수 있습니다. 경우 id 카운터 리셋에 의해 초기화되지 않은 카운터를 의미, 디폴트의 초기 값은 0입니다 |
| initial | 기본값으로이 속성을 설정합니다. 초기에 대해 알아보기 |
| inherit | 부모 요소에서이 속성을 상속합니다. 대한 상속 읽기 |
관련 페이지
CSS 참조 : : 의사 요소 전에
CSS 참조 : : 의사 요소 후
CSS 참조 : content property
CSS 참조 : counter-reset property
HTML DOM 참조 : counterIncrement property