<ol class="parents">
  <li>カレーライス</li>
  <li>からあげ</li>
  <li>ハンバーグ</li>
</ol>
<p>counter-resetの指定の仕方でカウント位置を変えることもできます。</pr>
<ol class="parents2">
  <li>カレーライス</li>
  <li>からあげ</li>
  <li>ハンバーグ</li>
</ol>
.parents {
    counter-reset: hoge;
    list-style: none;

    > li {
        counter-increment: hoge;

        &::before {
            content: counter(hoge)'.';
        }
    }

}

.parents2 {
    counter-reset: hogehoge 10;
    list-style: none;

    > li {
        counter-increment: hogehoge;

        &::before {
            content: counter(hogehoge)'.';
        }
    }

}
View Compiled

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.