#num h1:before{
content: counter(mycounter);
}
#num h1{
counter-increment: mycounter;/*这个值可以自己起名，但要与上面counter()内的值对应*/
}
示例文字。
示例文字。
示例文字。
#numAndText h1:before{
content: "第"counter(mycounter)"章 ";/*字符串连接中间不用加号*/
color: #00f;
font-size: 42px;
}
#numAndText h1{
counter-increment: mycounter;
}
示例文字。
示例文字。
示例文字。
#numType h1:before{
/*content: "第"counter(mycounter,upper-alpha)"章 ";*/
content: "第"counter(mycounter,lower-roman)"章 ";/*可以用列表的样式来控制项目编号的样式，如：list-style-type: lower-roman;*/
color: #00f;
font-size: 22px;
}
#numType h1{
counter-increment: mycounter;
}
示例文字。
示例文字。
示例文字。
#numNested h1:before{
/*content: "第"counter(mycounter,upper-alpha)"章 ";*/
content: "第"counter(mycounter)"章 ";
color: #00f;
font-size: 22px;
}
#numNested h1{
counter-reset: subcounter;/*在大标题开始时重置子标题*/
counter-increment: mycounter;
}
h2{
font-size: 1.3em;
}
#numNested h2:before{
content: "第"counter(subcounter)"节";
color: #00f;
font-size: 18px;
}
#numNested h2{
counter-increment: subcounter;
padding-left: 1em;
}
#multNested h1:before{
content: counter(mycounter)". ";
color: #00f;
font-size: 22px;
}
#multNested h1{
counter-reset: subcounter;/*在每次h1开始时重置h2编号*/
counter-increment: mycounter;
}
#multNested h2:before{
content: counter(mycounter)"-"counter(subcounter)". ";
color: #00f;
font-size: 18px;
}
#multNested h2{
counter-reset: subsubcounter;
counter-increment: subcounter;
padding-left: 1em;
}
#multNested h4:before{
content: counter(mycounter)"-"counter(subcounter)"-"counter(subsubcounter)". ";
color: #00f;
font-size: 18px;
}
#multNested h4{
counter-increment: subsubcounter;
padding-left: 2em;
}
#quote h1{
quotes:"("")";/*此处必须是两个字符串*/
}
#quote h1:before{
content: open-quote;
}
#quote h1:after{
content: close-quote;
}
/*跟上面显示效果一样，而且还少两行代码，不知为何要这样！*/
#quote h2:before{
content: "(";
}
#quote h2:after{
content: ")";
}