Страницы

Поиск по вопросам

понедельник, 15 октября 2018 г.

Какова причина, по которой меню верстают через ненумерованный список ul?

Какова причина, по которой меню верстают через ненумерованный список ul?
Не знаю "правильно" это или нет, но у меня получилось без всяких проблем сверстать нормально работающее одноуровневое горизонтальное меню в виде таблицы, а с помощью flexbox так и вообще замечательно всё верстается.


Ответ

Сначала для верстки таких меню действительно использовались таблицы потому что не было поддержки многих CSS-фич. Вообще все версталось таблицами. Со временем технологии развивались и таблицы потеряли свою актуальность в разметке страницы из-за того что таблицы сложно поддерживать.
Тогда была два актуальных варианта: обернуть ссылки в див, сделать список. Из этих двух подходов список более правилен с семантической точки зрения потому что меню — это как раз список ссылок.
В стандарте HTML5 появился тег nav, но, несмотря на это, в спецификации рекомендуют использовать список для списка ссылок для упрощения понимания структуры навигации. Как-то так:
nav { border: 1px solid #ccc; } nav ul { display: flex; width: 100%; margin: 0; padding: 0; } nav li { border-right: 1px solid #ccc; flex-grow: 1; padding: 5px; list-style: none; } nav li:last-child { border-right: none; }


Комментариев нет:

Отправить комментарий