マークダウンの見出しに連番を入れる_プリザンターにて

プリザンターでは[md]を使えば内容がマークダウンで記載できます。
その時に連番のためのスタイルを設定したかったので試してみました。

見出しに連番を入れるCSS

こちらの記事のをそのまま使わせて貰いました。
この内容をスタイルに設定して、「新規作成」「編集」にチェック。
https://qiita.com/itagakishintaro/items/437418f917cc31de10cd

そのままスタイルに入れただけではおかしくなった。
上のPleasanterの所に「0-1.」とでる！
内容の連番が「2.」から始まっている！

なぜ？。。。。
と思ったけど、このページ全体の見出しに対してのスタイルになるから、そらそうだ。。。

「内容」部分にだけ適用されるよに見直し

「内容」の部分は、<div class"md">となっているのでそのように、.mdを追加するように変更する。

これで「内容」部分だけに適用できた！！

スタイル.css

.md {
    counter-reset: chapter;
}
.md h1 {
    counter-reset: sub-chapter;
}
.md h2 {
    counter-reset: section;
}

.md h1::before {
    counter-increment: chapter;
    content: counter(chapter) ". ";
}
.md h2::before {
    counter-increment: sub-chapter;
    content: counter(chapter) "-" counter(sub-chapter) ". ";
}
.md h3::before {
    counter-increment: section;
    content: counter(chapter) "-" counter(sub-chapter) ".-" counter(section) ".";
}

.md h1, .md h2, .md h3 { 
    border-bottom: 5px solid #7db4e6;
}