Untitled

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <!-- <style>
    .upper-roman{
    list-style:upper-roman;
}
.lower-latin{
    list-style: lower-latin;
}
.number-decimal{
    list-style:decimal;
}
.circle{
    list-style: circle;
}
.disc{
    list-style: disc;
}


  </style> -->
    <body>
        <ol type = "I">

            <li>List item 1
                <ol type = "a">

                    <li>Nested item 1.1</li>
                    <li>Nested item 1.2</li>
                </ol>
            </li>
            <li>List item 2
                <ol type = "1">

                    <li>Nested item 2.1</li>
                    <li>Nested item 2.2</li>
                    <ul type = "circle">

                        <li>Nested item 2.2.1</li>
                        <li>Nested item 2.2.2</li>
                        <li>Nested item 2.2.3</li>
                    </ul>
                    <li>Nested item 2.3</li>
                </ol>

            </li>
            <li>List item 3
                <ul type = "disc">

                    <li>Nested item 3.1</li>
                    <li>Nested item 3.2</li>
                    <li>Nested item 3.3</li>
                </ul>

            </li>
        </ol>
    </body>
</html>