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

For Professional website contact WEB CODE ADDICT

View this post on Instagram A post shared by WebCodeAddict (@webcodeaddicted)