html - 让菜单切换垂直而不是水平切换导航栏

Question

代码演示：https ://jsfiddle.net/a8hu4Lo1/

我无法让菜单切换 ul/li 标签下拉并处于垂直状态。它们是水平的。

我怎样才能创建它，使它是垂直的？

我都试过了：

 .nav-li  {
   display: inline-block;
 }

 .nav-li  {
   display: block;
 }

以及以下变化：

 .nav-li div  {
  ...;
 }

我也在ul上试过。

ul 是：

 .div_underline {
   display: inline-block;
   margin: 0 20px;
   text-decoration: none;
 }

如何使切换菜单下拉为垂直 li 格式？

标签： htmlcssbootstrap-4

Answer 1

在css下面添加

.navbar-collapse .navbar-expand{
 flex-direction: column;
}

检查以下链接 https://jsfiddle.net/8gz1x7m4/