В мире веб-верстки списки встречаются повсеместно: от простых перечней товаров до сложной навигации. Обычно мы используем теги <ol> (ordered list) и <li> (list item), чтобы создать нумерованный список. Браузер автоматически начинает отсчет с единицы. Но что, если вам нужно начать не с первого пункта, а, скажем, с пятого или с десятого?
Именно для этого и существует атрибут start.
Что такое атрибут start?
Атрибут start используется исключительно с тегом <ol> (упорядоченный список). Он позволяет задать целое число, с которого начнется нумерация первого элемента списка.
Синтаксис:
Простой пример
Представьте, что вы пишете документацию и вам нужно продолжить список, который начался в предыдущей главе.
В браузере этот код выведет следующее:
4. Настройка файрвола
5. Установка веб-сервера (Nginx/Apache)
6. Подключение SSL-сертификата
Как видите, список начинается с четвертого пункта, что логично продолжает предыдущие три шага.
Работа с разными типами нумерации
Атрибут start отлично работает в связке с другим важным атрибутом — type. Атрибут type задает стиль нумерации (арабские цифры, римские цифры, буквы).
- type="1" — цифры (по умолчанию)
- type="A" — заглавные буквы (A, B, C...)
- type="a" — строчные буквы (a, b, c...)
- type="I" — заглавные римские цифры (I, II, III...)
- type="i" — строчные римские цифры (i, ii, iii...)
Важная особенность: В атрибуте start вы всегда указываете число (цифру), независимо от того, какой тип нумерации выбран. Браузер сам преобразует это число в нужный формат.
Пример с буквами
Допустим, мы хотим начать список с буквы "D" (четвертая буква алфавита):
<ol type="A" start="4">
<li>Пункт D</li>
<li>Пункт E</li>
<li>Пункт F</li>
</ol>
Результат:
D. Пункт D
E. Пункт E
F. Пункт F
Пример с римскими цифрами
Начнем отсчет с числа "III" (3):
<ol type="I" start="3">
<li>Третий пункт</li>
<li>Четвертый пункт</li>
</ol>
Результат:
III. Третий пункт
IV. Четвертый пункт
Для чего это нужно на практике?
- Разрыв списка: Если вам нужно вставить между пунктами списка большой блок текста, картинку или цитату, вы можете разбить один большой <ol> на два, используя start для второго списка, чтобы нумерация продолжилась с правильного места.
- Документация и инструкции: Как в примере выше — удобно для многостраничных инструкций.
- Юридические документы: В договорах и законах часто используется сложная иерархия пунктов, где нумерация должна идти строго по порядку, несмотря на врезки.
- Тесты и викторины: Если вопросы идут под номерами, но часть из них скрыта по условию.
Современное состояние и обоснованность применения
Атрибут start — это не пережиток прошлого. Он является полноправным членом спецификации HTML Living Standard. Вы можете смело использовать его в современных проектах, и он будет исправно работать во всех браузерах.
Альтернатива: атрибут value для <li>
Иногда нужно изменить нумерацию не всего списка, а конкретного пункта. Для этого существует атрибут value непосредственно у тега <li>. Он работает похожим образом: сбивает счетчик и продолжает нумерацию с нового значения.
Результат:
1. Иван
2. Петр
10. Сидоров
11. Кузнецов
Этот способ удобен, когда нужно выделить или пропустить отдельные элементы, не разбивая список на части.
Заключение
Атрибут start — простой, но мощный инструмент для управления нумерацией списков в HTML. Он дает разработчику гибкость в верстке содержимого сайтов, позволяя создавать структурированные и логичные документы без необходимости прибегать к сложным CSS-трюкам или скриптам. Запомните главное правило: в start всегда ставится число, а за преобразование в буквы или римские цифры отвечает атрибут type.
На этом всё. Подписывайтесь на канал, чтобы ничего не пропустить.