Упорядоченные списки HTML

Тег HTML <ol> определяет упорядоченный список, также известен как нумерованный список HTML.  Упорядоченный список может быть как числовым так и алфавитным!

Упорядоченный список HTML

Упорядоченный список начинается с тега <ol>. Каждый элемент списка начинается с тега <li>.

По умолчанию элементы списка будут отмечены цифрами:

<ol>
  <li>HTML</li>
  <li>CSS</li>
  <li>JavaScript</li>
</ol>

1. HTML
2. CSS
3. JavaScript

Упорядоченный список HTML — атрибут type

Атрибут type тега <ol> определяет тип маркера элемента списка:

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

<ol type="1">
  <li>HTML</li>
  <li>CSS</li>
  <li>JavaScript</li>
</ol>

1. HTML
2. CSS
3. JavaScript

Заглавные буквы

<ol type="A">
  <li>HTML</li>
  <li>CSS</li>
  <li>JavaScript</li>
</ol>

1. HTML
2. CSS
3. JavaScript

Строчные буквы

<ol type="a">
  <li>HTML</li>
  <li>CSS</li>
  <li>JavaScript</li>
</ol>

1. HTML
2. CSS
3. JavaScript

Прописные римские цифры

<ol type="I">
  <li>HTML</li>
  <li>CSS</li>
  <li>JavaScript</li>
</ol>

1. HTML
2. CSS
3. JavaScript

Строчные римские цифры

<ol type="i">
  <li>HTML</li>
  <li>CSS</li>
  <li>JavaScript</li>
</ol>

1. HTML
2. CSS
3. JavaScript

Подсчет контрольного списка

По умолчанию нумерованный список начинает отсчет с 1. Если вы хотите начать отсчет с указанного числа, вы можете использовать атрибут start:

<ol start="40">
  <li>HTML</li>
  <li>CSS</li>
  <li>JavaScript</li>
</ol>

40. HTML
41. CSS
42. JavaScript

Вложенные списки HTML

Списки могут быть вложенными (список внутри списка):

<ol>
 <li>HTML</li>
 <li>CSS
   <ol>
    <li>HTML5</li>
    <li>CSS3</li>
   </ul>
  </li>
  <li>JavaScript</li>
</ol>

1. HTML
2. CSS
   1. HTML5
   2. CSS3
3. JavaScript

Краткое содержание главы

• <ol> HTML  элемент для определения упорядоченного списка;
• type HTML атрибут для определения типа нумерации;
• <li> HTML элемент для определения элемента списка;
• Списки могут быть вложенными;
• Элементы списка могут содержать другие элементы HTML.

Справочник по тегам HTML

Справочник по тегам содержит дополнительную информацию об этих тегах и их атрибутах.

Полный список всех доступных тегов HTML см. в Справочнике по тегам HTML.

☛ Списки описаний HTML

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