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

#html #css

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

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

Ответы

Ответ 1

Сначала для верстки таких меню действительно использовались таблицы потому что не
было поддержки многих 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;
}

  

    
Пункт 1
    
Пункт 2
    
Пункт 3
    
Пункт 4
    
Пункт 5
    
Пункт 6