HiveBrain v1.2.0
Get Started
← Back to all entries
snippethtmlTip

Create a descending list of numbered items in HTML

Submitted by: @import:30-seconds-of-code··
0
Viewed 0 times
descendingitemshtmlnumberedlistcreate

Problem

Did you know there's an easy way to create a descending list of numbered items with pure HTML? The only thing you'll need is the reversed attribute. This boolean attribute is specific to ol elements and specifies that the list's elements are in reverse order (i.e. numbered from high to low).
Additionally, you can combine reversed with the start attribute which is an integer specifying the initial value of the list counter. For example, if you wanted to display the numbers 6 through 4 in a reversed 3-item list, you would simply add start="6".

Solution

<ol reversed>
  <li>My third favorite</li>
  <li>My second favorite</li>
  <li>My absolute favorite</li>
</ol>
<!--
  3. My third favorite
  2. My second favorite
  1. My absolute favorite
-->

Code Snippets

<ol reversed>
  <li>My third favorite</li>
  <li>My second favorite</li>
  <li>My absolute favorite</li>
</ol>
<!--
  3. My third favorite
  2. My second favorite
  1. My absolute favorite
-->

Context

From 30-seconds-of-code: reversed-list

Revisions (0)

No revisions yet.