Скрыть меню в CSS можно использовав свойство display и задав ему значение none.
Пример CSS-кода:
.menu {
display: none;
}
Этот код скрывает элементы с классом .menu.
Чтобы сделать меню снова видимым, можно использовать JavaScript для добавления класса смены display на странице.
Пример JavaScript-кода:
document.querySelector('.toggle-menu').addEventListener('click', function() {
document.querySelector('.menu').classList.toggle('active');
});
Этот код добавляет обработчик событий на клик по элементу с классом toggle-menu. Когда происходит клик на этом элементе, класс active добавляется элементу с классом menu, который изменит свойство display на block. Важно убедиться, что у элемента с классом .menu есть правильные стили, которые приведут его в нужный вид при изменении свойства display.
Существует также специальное значение visibility, которое можно использовать для скрытия элементов, не меняя их позицию на странице. Чтобы элемент был скрыт с использованием visibility, можно задать ему значение hidden:
.menu {
visibility: hidden;
}
Этот код скрывает элемент с классом .menu, но не изменяет его позиции на странице.
Чтобы сделать элемент снова видимым, можно использовать JavaScript для изменения значения свойства visibility на visible.
document.querySelector('.toggle-menu').addEventListener('click', function() {
document.querySelector('.menu').style.visibility = 'visible';
});
Этот код добавляет обработчик событий на клик по элементу с классом toggle-menu. Когда происходит клик на этом элементе, свойство visibility элемента с классом .menu изменяется на значение visible.





