Friday, July 12, 2024

CSS Counter Sets

 <!DOCTYPE html>

<html>

<head>

<style>

ol {

  counter-reset: section;

  list-style-type: none;

}


li::before {

  counter-increment: section;

  content: counters(section,".") " ";

}

</style>

</head>

<body>


<ol>

  <li>item</li>

  <li>item   

  <ol>

    <li>item</li>

    <li>item</li>

    <li>item

    <ol>

      <li>item</li>

      <li>item</li>

      <li>item</li>

    </ol>

    </li>

    <li>item</li>

  </ol>

  </li>

  <li>item</li>

  <li>item</li>

</ol>


<ol>

  <li>item</li>

  <li>item</li>

</ol>


</body>

</html>



====================Output========================









No comments:

Post a Comment

7 Must-Have WordPress Plugins to Boost Your Website in 2026

Want to make your WordPress site faster, smarter, and more powerful? Plugins are the secret weapon that can transform a basic blog into a pr...