Skip to main content

Reversed Ordered List - HTML


An ordered list starts with the <ol> tag. Each list item starts with the <li> tag. The list items will be marked with numbers by default, to make number descending order add attribute reversed in ol element.

DEMO

  1. Creeping Death (Ride The Lightning, 1984)
  2. Master Of Puppets (Master Of Puppets, 1986)
  3. One (…And Justice For All, 1988)
  4. For Whom The Bell Tolls (Ride The Lightning, 1984)
  5. Battery (Master Of Puppets, 1986)

HTML

<ol reversed>
  <li>Creeping Death (Ride The Lightning, 1984)</li>
  <li>Master Of Puppets (Master Of Puppets, 1986)</li>
  <li>One (And Justice For All, 1988)</li>
  <li>For Whom The Bell Tolls (Ride The Lightning, 1984)</li>
  <li>Battery (Master Of Puppets, 1986)</li>
</ol>

Comments

Popular posts from this blog

Audio Player - HTML

The HTML <audio> element is used to play an audio file, here are three supported audio formats MP3, WAV, and OGG for Safari OGG is not supported for now. DEMO Your browser does not support HTML audio. HTML < audio controls > < source src = "https://actions.google.com/sounds/v1/cartoon/crazy_dinner_bell.ogg" type = "audio/ogg" > < p > Your browser does not support HTML audio .</ p > </ audio > Muted < audio controls muted > < source src = "https://actions.google.com/sounds/v1/cartoon/crazy_dinner_bell.ogg" type = "audio/ogg" > < p > Your browser does not support HTML audio .</ p > </ audio >

Native Accordion - HTML

  Use details element to create native accordion, is so simple and effective without javascript. Tap here to see more details Lorem ipsum dolor sit amet consectetur adipisicing elit. Ut eum perferendis eius. Adipisci velit et similique earum quas illo odio rerum optio, quis, expedita assumenda enim dicta aliquam porro maxime minima sed a ullam, aspernatur corporis. Debitis nemo dolores sit in nihil vero, necessitatibus eveniet labore velit numquam voluptatibus quia. HTML < details > < summary > Tap here to see more details </ summary > < article > Lorem ipsum dolor sit amet consectetur adipisicing elit . Ut eum perferendis eius . Adipisci velit et similique earum quas illo odio rerum optio, quis, expedita assumenda enim dicta aliquam porro maxime minima sed a ullam, aspernatur corporis . Debitis nemo dolores sit in nihil vero, necessitatibus eveniet labore velit numquam voluptatibus qui...

Image Text Wrap-Around - CSS

Text wrap around the image with shape-outside for visual flair! DEMO Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec quis commodo nulla. Etiam commodo, augue eu volutpat vehicula, ipsum diam tincidunt orci, vel imperdiet quam felis at ipsum. Nulla sit amet dolor eu neque interdum pretium id cursus metus. Quisque malesuada orci mattis risus sodales rhoncus. Quisque commodo sagittis enim quis molestie. Vestibulum tincidunt at erat a iaculis. Sed tristique diam eget quam mollis, at ullamcorper mi imperdiet. Phasellus sit amet rutrum nisi. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec quis commodo nulla. Etiam commodo, augue eu volutpat vehicula, ipsum diam tincidunt orci, vel imperdiet quam felis at ipsum. Nulla sit amet dolor eu neque interdum pretium id cursus metus. Quisque malesuada orci mattis risus sodales rhoncus. Quisque commodo sagittis enim quis molestie. Vestibulum tincidunt at erat a iaculis. Sed tristique diam eget quam mollis, at u...