Нумерованный список в HTML

Тег ol в HTML

Для того чтобы на web-странице отображался нумерованный список в HTML предусмотрены теги <оl> и <li>. Между тегами <оl> помещаются сегменты списка которые начинаются с тега <li>.

Пример простого списка

Список ol

HTML

<ol>
	<li>простой список с номерами</li>
	<li>нумерованный список</li>
	<li>список с нумерацией</li>
</ol>

Примеры списков заданных стилями

Нумерация списка

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

HTML

<div class="list-decimal">
	<ol>
		<li>нумерованный стилями список</li>
		<li>простой список заданный стилями</li>
		<li>нумерация с помощью стилей</li>
	</ol>
</div>

Нумерация списка цифрами с нулём впереди

Создание списков в HTML

HTML

<div class="list-zero">
	<ol>
		<li>простой список с нумерацией</li>
		<li>арабские цифры с нулём впереди</li>
		<li>нумерация арабскими цифрами</li>
	</ol>
</div>


CSS

.list-zero,
.list-decimal
{
	font-size: 16px;
	line-height: 18px;
	letter-spacing: 2px;
	padding-top: 17px;
	padding-bottom: 17px;
}
.list-zero li {
	list-style-type: decimal-leading-zero;
	margin-left: 60px;
}
.list-decimal li {
	list-style-type: decimal;
	margin-left: 45px;
}