自動ナンバリングできるCSSカウンターを同ページ内で複数使うサンプル

Result 自動連番できるCSSカウンターを親要素と子要素の入れ子で2つ使う、みたいなやつ 異なるコンテナに含まれる同一要素に自動でナンバリングします 結論から言うと、複数のカウンター名を使えるのでそのまま使えば動作します cssbody {/*sectionsとboxesの2つのカウンター名を設定して初期化*/ counter-reset: sections boxes; } /*親要素のカウンター*/ section { counter-increment: sections; } section::before {/*数字に接頭語を付与*/ content: 'その' counter(sections); } /*子要素のカウンター*/ .box { counter-increment: boxes; } .box::before { content: counter(boxes,