Html TopBar不显示响应菜单-基础5

我目前正在与合作，并最终尝试使我的页面移动友好。我有一个顶部导航栏，我已经为页面创建了一些基本结构。导航栏在响应时出现问题。当我缩小屏幕时，它根本不显示菜单。如何使导航栏具有响应性

HTML:

您已经为它指定了类

。对于包含所有下拉列表的主类，隐藏为small

然后是手机可以看到的，里面没有数据

添加

以获得适当的响应topbar

<nav class="tab-bar show-for-small">
<a class="left-off-canvas-toggle menu-icon">
<span>Title</span>
</a>
</nav>

<nav class="top-bar docs-bar hide-for-small" data-topbar>
<ul class="title-area">
<li class="name">
<h1>
<a href="#">Title</a>
</h1>
</li>
</ul>
<section class="top-bar-section">
<ul class="right">
<li class="divider"></li>
 <li class="has-dropdown not-click">
    <a class="" href="#">Test</a>
    <ul class="dropdown">
    <li>
    <a href="#">SubTest</a>
    </li>
    </ul>
 </li>
 <li class="divider"></li>
 <li class="has-dropdown not-click">
    <a class="" href="#">Test2</a>
    <ul class="dropdown">
    <li>
    <a href="#">SubTest2</a>
    </li>
    </ul>
 </li>
<li class="divider"></li>
 <li class="has-dropdown not-click">
    <a class="" href="#">Test3</a>
    <ul class="dropdown">
    <li>
    <a href="#">SubTest3</a>
    </li>
    </ul>
 </li>
 </ul>
</section>
</nav>