div>h2{
counter-increment:one; /*将计数器命名为one*/
counter-reset:two; /*将two计数器重置归零*/
}
div>div{
counter-increment:two;
}
div>h2:before{
content:counter(one,georgian) '.'; /*这里调用计数器one, 显示样式是georgian*/
font-size:20pt;
font-weight:bold;
}
div>div:before{
content:'第' counter(two) '本.';
font-size:13pt;
font-weight:bold;
}
<html>
<body>
<div>
<h2>系列一</h2>
<div> java语言使用教程</div>
<div>C++语言程序设计</div>
<div>css网站布局</div>
<h2>系列二</h2>
<div>四级词汇</div>
<div>大学专业英语</div>
<div>易考范文背诵</div>
</div>
</body>
</html>
counter(name) 或counter(name, style)
这里对 style样式介绍一下：
disc ：实心圆点；circle：空心圆点；square：实心方块；decimal：阿拉伯数字；lower-roman：i, ii, iii, iv, v…upper-roman.：I, II, III, IV, V…lower-greek：α, β, γ…upper-latin：A, B, C, … Zsimp-chinese-formal：壹,贰,叁...cjk-ideographic:一,二,三...
更多样式：
https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type
515
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
