目次

1. はじめに
2. 問題点
3. 解決策
4. 今後の課題
5. まとめ
6. 索引

このページのCSS:

<style>
#toc { margin-left: 20px; }
.chapter { font-weight: bold; }
A { text-decoration: none; }
H1 + #toc { margin-top: 40px; }
#toc > LI { font-weight: bold; }
#toc A { color: #444; }
* { font-family: Arial; }
[href="#index"] { font-style: italic; }
[title~="Index"] { font-style: italic; }
A:hover { text-decoration: underline; }
</style>

上の目次のHTMLコード

<h1>目次</h1>
<ol id=toc>
  <li class=chapter> <a href="#introduction">はじめに</a>
  <li class=chapter> <a href="#problem">問題点</a>
  <li class=chapter> <a href="#solution">解決策</a>
  <li class=chapter> <a href="#issues">今後の課題</a>
  <li class=chapter> <a href="#conclusion">まとめ</a>
  <li class=chapter> <a href="#index" title="索引">Index</a>
</ol>