An ordered list in HTML that is numbered using odd numbers

Question

Using <ol type="1">in HTML, I can get an ordered list so that it looks like this:

• I like cheese.
• Cookies are nice
• The cream is good ...

How to use <ol>to get an ordered list with only odd numbers, for example?

1. I like cheese

3. Good food

5. I wish the stars ...

Answer 1

I do not think that this can be achieved using regular ordered lists, because only available attributes are available (even including HTML5):

• type (indicates the type of numbering)
• start ( )
• reverse (, )

CSS, . CSS , .

---

:

• (reset) , counter-reset . counter-reset . -1 , li 2, 1 ( -1 + 2 = 1).
• 2 , a li. . , counter-increment 2 : - , - , .
• :before content.

ol {
  counter-reset: odd-numbers -1;
  list-style-type: none;
}
li {
  counter-increment: odd-numbers 2;
}
li:before {
  content: counter(odd-numbers) ". ";
}

<ol>
  <li>Item 1</li>
  <li>Item 2</li>
  <li>Item 3</li>
</ol>

Hide result

---

-1 li:first-child 1 ( counter-increment). li 2.

ol {
  counter-reset: odd-numbers;
  list-style-type: none;
}
li:first-child {
  counter-increment: odd-numbers;
}
li {
  counter-increment: odd-numbers 2;
}
li:before {
  content: counter(odd-numbers) ". ";
}

<ol>
  <li>Item 1</li>
  <li>Item 2</li>
  <li>Item 3</li>
</ol>

Hide result

Answer 2

css, .

li:nth-child(2n) {
  visibility: hidden;
  position: absolute;
}

li:

<ol>
<li>1</li>
<li></li>
<li>3</li>
<li></li>
...
</ol>