桌面视图上的SlikNav多级菜单？

Question

我正在使用SlikNav制作移动导航菜单.我有这个结构:

<nav>
    <ul>
        <li>
            <a href="#">Home</a>
        </li>
        <li>
            <a href="#">Products</a>
            <ul>
                <li>
                    <a href="#">Child1</a>
                </li>
                <li>
                    <a href="#">Child2</a>
                </li>
            </ul>
        </li>
    </ul>
</nav>

这在移动视图上工作正常,这是一个codepen.

我的桌面版本很简单:nav ul li { display:inline; }这使列表显示为内联.

我的问题是,SlickNav可以让下拉菜单也可以在桌面视图中使用吗？

Answer 1

现在，菜单已经是桌面模式和移动模式下的下拉菜单。

只是为了看起来不错，这样做 - 在 ul 中的 li 之后添加一个类“sub”。

<nav>
  <ul>
    <li><a href="#">Home</a></li>
    <li><a href="#">Products</a>
      <ul class="sub">
        <li><a href="#">Child1</a></li>
        <li><a href="#">Child2</a></li>
      </ul>
    </li>
  </ul>
</nav>

和CSS -

li{
  float: left;
}
li > ul.sub{
  margin: 0;
}