How To Reverse Numbering In Ordered List Using HTML?

   by   Hemant Singh      /   last updated on - June 1, 2020

Blog Image

Do you ever wondered how you can make numbering in ordered list reverse. For example by default an ordered list start from 1,2,3,4... .But a reverse ordered list will have opposite order like ...4,3,2,1.
So to do so we have to use "reversed" attribute.

As we know ,
An ordered list "ol" have all the items numbered . So ,when we have list items "li" it will automatically put numbers in front of each item by order.

What we usually not know is that we can add attribute that can define the order of "ol". These two attribute are "start" and "reversed". By default an ordered list have "start" ,so it will always put numbers by order - 1,2,3,4... , if we have not stated anything .

But if we want numbering in opposite order then we have to add "reversed" attribute.

And thing to note is that only the order of numbers change not the actual items.
Code Reversed attribute Image

Output :

Code Reversed attribute Image

CSS behind this is shown below ,but it has no link with reversing the ordered list, CSS is only to make output look good, so that you can differentiate between two list.

Code Reversed attribute Image

Also read my poem :Khwab m bhi jeeta hu Click here
Also read my poem :Veer Jawan Click here
Also read this :Css Box model - Basic and very useful Click here
Also read blog :Health and wellness. Click here
See beautiful art :Uttrakhand tradition using art Click here
See beautiful art :Doodle art Click here

About Author

...     ...
Card image cap
Hemant Singh

Web developer | StartYourBlog
Web dev blogs | Poetry | Writer
CS(hons) DU
Never fear to start.

Read More Blogs