How to set the start value of an ordered list in HTML

Published:
Updated:
Author:
License:
CC BY-SA 4.0

The start attribute in HTML is used to determine the starting value (number) for an ordered list (<ol>), allowing customization of the list's numbering. It can be set to any positive, zero, or negative value, and works even when the ordered list is nested within an unordered list.

Introduction #

The start attribute in HTML is used with the <ol> (ordered list) element to specify the starting number for the list items. in HTML, by default, ordered lists start with the number 1, but the start attribute allows you to change this starting value to any number you choose.

The start attribute only works with ordered lists (<ol>), not unordered lists (<ul>).

Positive Starting Number #

To set the start value of an ordered list to 5, simply do:

<ol start="5">
  <li>First item</li>
  <li>Second item</li>
  <li>Third item</li>
</ol>

The ordered list will start numbering from 5, producing:

  1. First item
  2. Second item
  3. Third item

Of course, this also works if the ordered list is contained in an unordered list.

<ul>
  <li>Item 1</li>
  <li>Item 2
    <ol start="5">
      <li>First item</li>
      <li>Second item</li>
      <li>Third item</li>
    </ol>
  </li>
  <li>Item 3</li>
</ul>

Also, the ordered list, inside and unordered list, will start numbering from 5, producing:

Negative Starting Number #

You can use negative numbers or zero if needed:

<ol start="-3">
  <li>Negative three</li>
  <li>Negative two</li>
  <li>Negative one</li>
</ol>

The ordered list will start numbering from -3, producing:

  1. Negative three
  2. Negative two
  3. Negative one

Use Cases #

Further readings #

Sources and recommended, further resources on the topic:

Jonas Jared Jacek • J15k

Jonas Jared Jacek (J15k)

Jonas works as project manager, web designer, and web developer since 2001. On top of that, he is a Linux system administrator with a broad interest in things related to programming, architecture, and design. See: https://www.j15k.com/

License: How to set the start value of an ordered list in HTML by Jonas Jared Jacek is licensed under CC BY-SA 4.0.

This license requires that reusers give credit to the creator. It allows reusers to distribute, remix, adapt, and build upon the material in any medium or format, for noncommercial purposes only. To give credit, provide a link back to the original source, the author, and the license e.g. like this:

<p xmlns:cc="http://creativecommons.org/ns#" xmlns:dct="http://purl.org/dc/terms/"><a property="dct:title" rel="cc:attributionURL" href="https://www.ditig.com/instructions/how-to-set-the-start-value-in-html-ordered-list">How to set the start value of an ordered list in HTML</a> by <a rel="cc:attributionURL dct:creator" property="cc:attributionName" href="https://www.j15k.com/">Jonas Jared Jacek</a> is licensed under <a href="https://creativecommons.org/licenses/by-sa/4.0/" target="_blank" rel="license noopener noreferrer">CC BY-SA 4.0</a>.</p>

For more information see the DITig legal page.

“Obey standards unless you've a darn good reason.”

Alan Cooper , Software designer and programmerAbout Face, - IT quotes