指定编号的种类:
<style>
h1:before{content:counter(mycounter)'.';
color:blue;
font-size:42px;
}
h1{
counter-increment:mycounter;
counter-reset:subcounter;
}
h2:before{
content:counter(mycounter)'.';
}
h2{
counter-increment:mycounter;
}
h3:before{
content:counter(subcounter)'.';
}
h3{
counter-increment:subcounter;
margin-left:40px;
}
</style>
</head>
<body>
<h1>大标题</h1>
<p>示例文字</p>
<h1>大标题</h1>
<p>示例文字</p>
<h1>大标题</h1>
<p>示例文字</p>
<br/>
<hr/>
<h2>大标题</h2>
<h3>中标题</h3>
<h3>中标题</h3>
<h3>中标题</h3>
<h2>大标题</h2>
<h3>中标题</h3>
<h3>中标题</h3>
<h3>中标题</h3>
</body>
编号错层嵌入的示例:
<style>
h1:before{
content:counter(mycounter)'.';
}
h1{
counter-increment:mycounter;
counter-reset:subcounter;
}
h2{
counter-increment:subcounter;
counter-reset:subsubcounter;
margin-left:40px;
}
h3:before{
content:counter(mycounter)'_'counter(subcounter)'_'counter(subsubcounter)'.';
}
h3{
counter-increment:subsubcounter;
margin-left:40px;
}
</style>
</head>
<body>
<h1>大标题</h1>
<h2>中标题</h2>
<h3>小标题</h3>
<h3>小标题</h3>
<h2>中标题</h2>
<h3>小标题</h3>
<h3>小标题</h3>
<h1>大标题</h1>
<h2>中标题</h2>
<h3>小标题</h3>
<h3>小标题</h3>
<h2>中标题</h2>
<h3>小标题</h3>
<h3>小标题</h3>
</body>
再字符串中嵌套文字符号:
<style>
h1:before{
content:open-quote;
}
h1:after{
content:close-quote;
}
h1{
quotes:"(" ")";
}
h2:before{
content:open-quote;
}
h2:after{
content:close-quote;
}
h2{
quotes:"\"" "\"";
}
</style>
</head>
<body>
<h1>标题</h1>
<h2>标题</h2>
</body>