JSFiddle - React, Tailwind, and code Playground

by eleonore

HTML

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>Нумерованные списки</title>
        <style type="text/css">
            body {
                padding: 7px;
            }
            li {
                list-style-type: none;
            }
            /* Убираем исходную нумерацию у списка */
            .list1 {
                counter-reset: list 0;
            }
            /* Инициируем счетчик */
            .list2 {
                counter-reset: list 5;
            }
            ol li:before {
                counter-increment: list;
                /* Увеличиваем значение счетчика */
                content:"0" counter(list)". ";
                /* Выводим число */
                margin-left: 15px;
            }
        </style>
        <!--[if lt IE 8]>
            <style>
                ol {
                    list-style-type: decimal;
                }
                </style <![endif]--> </head> <body> <p>Первый список, начинается с 1:</p> <ol class="list1"> <li>Баал</li> <li>Агарес</li> <li>Марбас</li> <li>Пруфлас</li> <li>Аамон</li> </ol> <p>Второй список начинается с 6:</p> <ol class="list2"> <li>Барбатос</li> <li>Буер</li> <li>Гасион</li> <li>Ботис</li> </ol> </body> </html>