« 春分の日 | トップページ | ユスラウメが咲いた。タラノメを食べた。 »

2012/03/23

階層化した箇条書きに n.n 形式の番号を振るスタイルシート

ホームページ制作者のためのWebアクセシビリティ解説書」より

例.

以下のCSS2のスタイルシートは、UL要素またはOL要素で作られた入れ子のリストに対して、階層ごとの番号を組合せた番号をつけるものです。各項目は、「1, 1.1, 1.1.1」のように番号が付けられる。

<STYLE type="text/css">
UL, OL { counter-reset: item }
LI { display: block }
LI:before { content: counters(item, "."); counter-increment: item }
</STYLE>

試して見たところ、Firefox 11.0 では予想通りに表示されたが、Internet Explorer 8 では変化なし。

うーむ。
番号付きリストと番号なしリストを併用していると、番号なしリストにも番号が振られてしまうのが何だなぁ。

|

« 春分の日 | トップページ | ユスラウメが咲いた。タラノメを食べた。 »

コメント

コメントを書く



(ウェブ上には掲載しません)


コメントは記事投稿者が公開するまで表示されません。



トラックバック


この記事へのトラックバック一覧です: 階層化した箇条書きに n.n 形式の番号を振るスタイルシート:

« 春分の日 | トップページ | ユスラウメが咲いた。タラノメを食べた。 »