桌面视图上的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

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

为了看起来不错，那样做 - 在li之后在ul中添加一个类“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;
}

Answer 2

我不知道该怎么做，但是我有一个替代的快速解决方案。

您可以使用smartmenu Plugin，这是示例Click Here

希望对您有帮助。