<ol>‘s start and reversed attributes (and more)

Handy for those end-of-year lists 😉

~

Apart from overriding the list style using CSS’s list-style-type (which you should set it on the <ul>/<ol> element, not the <li>), you can also set the list style for unordered lists it from your HTML using the type attribute.

  • a for lowercase letters
  • A for uppercase letters
  • i for lowercase Roman numerals
  • I for uppercase Roman numerals
  • 1 for numbers (default)

⚠️ Do note that this type attribute only is allowed on the <ol> element – not the <ul> element – according to the spec.

~

Additionally, you can also override the value of an <li> element inside an <ol> element using its value attribute:

See how it jumps from 5 to 10? That’s value in action.

Published by Bramus!

Bramus is a frontend web developer from Belgium, working as a Chrome Developer Relations Engineer at Google. From the moment he discovered view-source at the age of 14 (way back in 1997), he fell in love with the web and has been tinkering with it ever since (more …)

Leave a comment

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.