CSS3使用计数器自动添加数字序号功能

此代码仅供参考

---

代码说明

自动为章节添加数字序号功能，那些章节中的数字序号并不是本来就有，是用CSS生成的，所以在用时候，只需定义好，CSS会帮你自动加上这些序号，很实用吧。

---

html代码

<style type="text/css"> ul { list-style: none; text-align:left; } .menu { counter-reset: chapter; } .menu > li { counter-increment: chapter; counter-reset: section; } .menu > li:before { content: "第" counter(chapter) "章"; padding-right: .5em; } .menu ul > li { counter-increment: section; } .menu ul > li:before { content: "第" counter(section) "节"; padding-right: .5em; } </style> <ul class="menu"> <li>ASP教程 <ul> <li>变量</li> <li>函数</li> <li>对象</li> <li>数据库</li> <li>输出</li> </ul> </li> <li>PHP教程 <ul> <li>PHP变量</li> <li>PHP函数</li> <li>对象</li> <li>PHP数据库</li> <li>输出</li> </ul> </li> </ul>

---

代码演示

• ASP教程
  • 变量
  • 函数
  • 对象
  • 数据库
  • 输出
• PHP教程
  • PHP变量
  • PHP函数
  • 对象
  • PHP数据库
  • 输出

---

---