Вот простой пример HTML-кода с CSS-стилями для создания раскрываемого (разворачивающегося) меню:
Разворачивающееся меню
Пример разворачивающегося меню:
Как это работает?
- Элемент .dropdown — родительский контейнер, содержащий основное название («Меню»).
- Внутри контейнера располагается элемент .dropdown-content, скрытый изначально (display: none), но показывающийся при наведении мыши (:hover) благодаря изменению свойства display.
- Список ссылок реализован с использованием обычного элемента внутри блока .dropdown-content. Это позволяет создать простоту и читаемость кода.
Такой подход широко используется для простых раскрывающихся списков на сайтах и отлично работает практически во всех современных браузерах.