В чем разница оформления выпадающих списков тегом select и li?

Question

[Nastya012]

Почему в данном примере казалось бы одну вещь оформили по разному?
То, что обведено синеньким кружком оформлено при помощи списка ul li, а то, что в зеленом кружочке- оформлено как select.
Отсюда вопрос: почему все нельзя оформить как select или ul li?

П.С. код на всякий случай тоже скину
П.С. п.с. я новичок, по этому прошу сильно не ругать, если что)
ПЕРВЫЙ СКРИНШОТ

ВТОРОЙ СКРИНШОТ

ТРЕТИЙ СКРИНШОТ

ЧЕТВЕРТЫЙ СКРИНШОТ

ПЯТЫЙ СКРИНШОТ

Comments

[Андрей]

К тому же select в отличии от ul нельзя полностью настроить с помощью css, и например добавить изображения флажков перед странами в списке вообще не проблема, а в селекте сделать это кроссбраузерно весьма нетривиальная задача

[Nastya012]

Андрей, спасибо вам

[Андрей]

И на десерт: пишем select получаем ul :)
https://select2.org/
www.marghoobsuleman.com/jquery-image-dropdown

Answer 1

[kreoTech]

Зеленая это select, а не section. Тут использован именно этот тег, потому что элемент принадлежит к форме поиска на сайте. И при запуске поиска будет автоматически считано состояние этого переключателя.

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

Comments

[Nastya012]

спасибо за ответ, теперь все понятно