当屏幕变小时，如何使导航栏上的元素堆叠在一起？

@media screen and (max-width: 768px) {
  /* 在屏幕宽度小于768px时应用以下样式 */
  .navbar {
    flex-direction: column; /* 将导航栏元素的布局改为垂直方向 */
  }
  .navbar-item {
    margin-bottom: 10px; /* 设置导航栏元素之间的间距 */
  }
}

.navbar {
  display: flex;
  flex-direction: column; /* 将导航栏元素的布局改为垂直方向 */
}

.navbar-item {
  margin-bottom: 10px; /* 设置导航栏元素之间的间距 */
}

.navbar {
  display: grid;
  grid-template-columns: 1fr; /* 将导航栏元素的布局改为自动堆叠 */
}

.navbar-item {
  margin-bottom: 10px; /* 设置导航栏元素之间的间距 */
}