Атрибут id тега <ul>


Описание

Атрибут id задаёт уникальный идентификатор для списка <ul>. Этот идентификатор позволяет:

  • Обращаться к списку из CSS и JavaScript
  • Создавать якорные ссылки внутри страницы
  • Связывать элементы форм с их описаниями
Пример использования:
<ul id="main-navigation"> <li>Главная</li> <li>О компании</li> <li>Контакты</li> </ul>

Правила именования ID:

  • Должен начинаться с буквы (A-Z, a-z)
  • Может содержать цифры, дефисы, подчёркивания, точки
  • Должен быть уникальным в пределах документа
  • Чувствителен к регистру (case-sensitive)
  • Не должен содержать пробелов

Типичные применения:

Тип списка Пример ID Назначение
Навигационное меню main-nav, primary-menu Основная навигация по сайту
Список фильтров product-filters Фильтрация товаров/контента
Дерево категорий category-tree Иерархическая структура

Пример стилизации через ID:

<style> #special-list { list-style-type: square; border-left: 3px solid #3498db; padding-left: 20px; } </style> <ul id="special-list"> <li>Особый пункт 1</li> <li>Особый пункт 2</li> </ul>

Рекомендации:

  • Используйте осмысленные имена (не "list1", "list2")
  • Придерживайтесь единого стиля именования (kebab-case рекомендован)
  • Для повторяющихся элементов используйте классы, а не ID
  • Избегайте избыточности (не "ul-list", если это и так ul)

Ограничения:

  • Один ID может быть присвоен только одному элементу
  • Изменение ID может сломать существующие ссылки и скрипты
  • Чрезмерное использование ID усложняет поддержку кода

Пример создания якорной ссылки:

<ul id="chapter-2"> <li>Пункт 2.1</li> <li>Пункт 2.2</li> </ul> <a href="#chapter-2">Перейти к Главе 2</a>

Примечание: Хотя ID полезны для уникальных элементов, для стилизации списков чаще рекомендуется использовать классы, чтобы сохранить возможность повторного использования стилей.