建议在Firefox或Chrome中测试,在模拟器中预览。
【示例】
-
CSS
ol { list-style:none;} /*清除默认的序号*/ li:before {color:#f00; font-family:Times New Roman;} /*设计层级目录序号的字体样式*/ li{counter-increment:a 1;} /*设计递增函数a,递增起始值为1 */ li:before{content:counter(a)". ";} /*把递增值添加到列表项前面*/ li li{counter-increment:b 1;} /*设计递增函数b,递增起始值为1 */ li li:before{content:counter(a)"."counter(b)". ";} /*把递增值添加到二级列表项前面*/ li li li{counter-increment:c 1;} /*设计递增函数c,递增起始值为1 */ li li li:before{content:counter(a)"."counter(b)"."counter(c)". ";} /*把递增值添加到三级列表项前面*/
-
HTML
<h1>网站导航</h1> <ol> <li>新闻 <ol> <li>国际新闻</li> <li>国内新闻 <ol> <li>互联网/科技</li> <li>财经/理财</li> </ol> </li> </ol> </li> <li>交互</li> </ol>