HTML怎么级联编号
发布时间:2015-05-12 来源:查字典编辑
摘要:CSScounter-reset属性CSScounter-reset属性用于设置某个选择器出现次数的计数器的值。我们就可以使用以下有序列表进...
CSS counter-reset 属性
CSS counter-reset 属性用于设置某个选择器出现次数的计数器的值。
![HTML怎么级联编号2](/Images/jiaocheng/2015-05-0716/2430299704.jpg)
我们就可以使用以下有序列表进行测试:
![HTML怎么级联编号3](/Images/jiaocheng/2015-05-0716/4202835262.jpg)
![HTML怎么级联编号4](/Images/jiaocheng/2015-05-0716/3723329269.jpg)
counter-increment 属性
counter-increment 属性用于设置某个选取器每次出现的计数器增量。默认增量是 1。
![HTML怎么级联编号5](/Images/jiaocheng/2015-05-0716/961054345.jpg)
依旧使用上面的序列,另外使用counter-reset: item -1进行测试
![HTML怎么级联编号6](/Images/jiaocheng/2015-05-0716/2923745976.jpg)
HTML DOM content 属性
通过content 属性来改变列表的编号。这里主要介绍其中的counter用法
![HTML怎么级联编号7](/Images/jiaocheng/2015-05-0716/776577773.jpg)
下面通过counters方法将所有的计数器显示,以圆点(.)分隔,list-style-tyle为decimalcontent: counters(item,".",decimal) "# ";
![HTML怎么级联编号8](/Images/jiaocheng/2015-05-0716/4483828.jpg)
完整代码
![HTML怎么级联编号9](/Images/jiaocheng/2015-05-0716/1864395664.jpg)