Как сделать нумерацию римскими цифрами?

Для создания римской нумерации списка к элементу <ol> добавляется атрибут type со значением I (римские цифры в верхнем регистре — I, II, III) или значением i (римские цифры в нижнем регистре — i, ii, iii). В примере 1 показано создание списка с римскими цифрами.

Пример 1. Использование атрибута type

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Римские цифры</title> </head> <body> <ol type="I"> <li>тысячелетие до н. э.</li> <li>тысячелетие до н. э.</li> <li>тысячелетие до н. э.</li> </ol> </body> </html>

Результат данного примера показан на рис. 1. Обратите внимание, что нумерация выравнивается по точке.

Вид нумерованного списка

Рис. 1. Вид нумерованного списка

Также можно управлять типом нумерации через стили. Для этого к селектору ol или li надо добавить свойство list-style-type со значением upper-roman или lower-roman. В примере 2 показано создание списка с римскими цифрами в нижнем регистре.

Пример 2. Использование свойства list-style-type

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Римские цифры</title> <style> li { list-style-type: lower-roman; /* Цифры i, ii, iii,… */ } </style> </head> <body> <ol type="I"> <li>тысячелетие до н. э.</li> <li>тысячелетие до н. э.</li> <li>тысячелетие до н. э.</li> <li>тысячелетие до н. э.</li> </ol> </body> </html>

Результат данного примера показан на рис. 2.

Вид нумерованного списка