css - Foundation-4 折叠菜单不出现

Question

我直接使用 Foundation 文档中的代码，但不知何故它对我不起作用。

我是这样写代码的:

  <nav class="top-bar">
    <ul class="title-area">
        <li class="toggle-topbar menu-icon"><a href="#"><span>MENU</span></a></li>
    </ul>
    <section class="top-bar-section" style="left: 0%;">
    <!-- Left Nav Section -->
        <ul class="left">
          <li class="active"><a href="#">Main Item 1</a></li>
          <li class="active"><a href="#">Main Item 1</a></li>
          <li class="active"><a href="#">Main Item 1</a></li>
         </ul>
    </section>
</nav>

当我缩小浏览器窗口并达到“小”窗口大小时，菜单从页面上消失。知道我做错了什么吗？

Answer 1

@Xarcell，我不是因为这个原因才使用 Foundation 的。我正在构建一个响应式网站，这就是我使用 Foundation 的原因。提到的问题只是我遇到这个框架的问题之一。顺便说一句:Foundation-4 是 Zurb 的响应式网页设计框架。

@Dawood Awan，jQuery 和 Foundation 链接正确。其余功能都运行良好，所以我知道它的链接。我遇到的问题是菜单本身。

我自己回答这个问题，因为我解决了这个问题。

文档提到下面提到的代码是可选的，因此我没有使用它。但似乎我必须使用它(即使它是空白的)来使我的菜单正常工作。

<li class="name">
  <h1></h1>
</li>

希望这对遇到类似问题的其他人有所帮助。