Тег <dir>
Описание
Тег <dir> устарел в HTML5 и не должен использоваться. Ранее применялся для создания списка директорий (каталогов). Вместо него всегда используйте <ul>.
Важно! Этот элемент удалён из спецификации HTML5 и сохраняется только для обратной совместимости.
Историческое использование (не рекомендуется):
<!-- Устаревший синтаксис -->
<dir>
<li>Документы</li>
<li>Изображения</li>
<li>Музыка</li>
</dir>
<!-- Правильный современный вариант -->
<ul class="directory-list">
<li>Документы</li>
<li>Изображения</li>
<li>Музыка</li>
</ul>
<style>
.directory-list {
list-style-type: none;
padding-left: 0;
}
.directory-list li::before {
content: "📁 ";
}
</style>
<ul class="directory-list">
<li>Projects</li>
<li>Downloads</li>
</ul>
Почему <dir> больше не используется:
- Устарел в пользу семантически нейтрального
<ul> - Не поддерживается в современных стандартах
- Не предоставляет реальных преимуществ перед
<ul> - Может вызывать проблемы с валидацией кода
Рекомендации по замене:
- Всегда используйте
<ul>для неупорядоченных списков - Для иерархических структур применяйте вложенные
<ul> - Используйте CSS для стилизации списков под файловые структуры
- Для сложных деревьев каталогов рассмотрите специальные компоненты UI
Совет: При работе с устаревшим кодом просто замените все <dir> на <ul> и при необходимости добавьте CSS-стили.
Атрибуты
| compact | Уменьшает отступы между элементами списка (устарел в HTML5) |
| accesskey | Определяет горячую клавишу для активации/фокусировки элемента |
| class | Задает один или несколько классов CSS для стилизации элемента |
| contenteditable | Указывает, может ли пользователь редактировать содержимое элемента |
| data-* | Используется для хранения пользовательских данных в элементах |
| dir | Определяет направление текста: слева направо (ltr) или справа налево (rtl) |
| hidden | Скрывает элемент, делая его невидимым и недоступным для пользователя |
| id | Уникальный идентификатор элемента в документе |
| lang | Определяет язык содержимого элемента |
| spellcheck | Указывает, должна ли проверяться орфография в содержимом элемента |
| style | Позволяет задавать CSS-стили непосредственно в атрибуте элемента |
| tabindex | Определяет порядок перехода между элементами при нажатии Tab |
| title | Задает всплывающую подсказку при наведении на элемент |
| translate | Указывает, должен ли переводиться текст внутри элемента |
Поддержка браузерами
 |
 |
 |
 |
 |
|---|---|---|---|---|
| 3.0 | 1.0 | 1.0 | 1.0 | 1.0 |