Hide number in ordered list if there is only one element in the list-CodePudding

Say I have a ordered list like this.

<ol>
  <li>a</li>
<ol>

Since this ol only has one item, I want to render it as

On the other hand, if there are more than one item in the list like below, I want to render 1., 2.s.

<ol>
  <li>a</li>
  <li>b</li>
<ol>

should be

1. a
2. b

Is there a way to do this in pure CSS?

CodePudding user response：

li:only-of-type { list-style-type: none; }

<h1>List 1</h1>
<ol>
  <li>Coffee</li>
  <li>Tea</li>
</ol>


<h1>List 2</h1>
<ol>
  <li>Coffee</li>
</ol>