【CSS3】CSSカウンタで昇順や降順に採番する方法
counter-resetプロパティcounter-incrementプロパティcontentプロパティcounter関数
See the Pen
css-counter by shiakisudev (@shiakisu)
on CodePen.
HTML
<h2>初めに</h2>
<h2>朝は〇〇をすべし</h2>
<h2>昼は〇〇をすべし</h2>
<h2>夜は〇〇をすべし</h2>
<h2>終わりに</h2>
CSS
body{
counter-reset:num
}
h2::before{
counter-increment:num;
content:"第"counter(num)"章 ";
}
See the Pen
css-counter-decrement by shiakisudev (@shiakisu)
on CodePen.
以上で記事の解説はお終い！
HTML、CSS、JavaScriptをもっと勉強したい方にはUdemyがオススメ！同僚に差をつけよう！