使用窗口缩小div菜单

<div class="menu">
  <button class="menu-toggle"></button>
  <ul class="menu-items">
    <li>菜单项1</li>
    <li>菜单项2</li>
    <li>菜单项3</li>
  </ul>
</div>

.menu {
  position: relative;
}

.menu-toggle {
  display: none;
}

.menu-items {
  display: flex;
  flex-direction: column;
}

@media (max-width: 768px) {
  .menu-toggle {
    display: block;
  }
  
  .menu-items {
    display: none;
  }
  
  .menu-items.show {
    display: flex;
  }
}

const menuToggle = document.querySelector('.menu-toggle');
const menuItems = document.querySelector('.menu-items');

menuToggle.addEventListener('click', function() {
  menuItems.classList.toggle('show');
});