Html 角度材质2导航栏至汉堡包菜单

我在试着用这个。 Adter Bootstrap 3我曾经使用simle导航条，它可以生成所有内容，而您不必实现它们背后的任何逻辑。。e、 g:当屏幕太小，无法显示每个菜单元素时，他们会转到汉堡包菜单

我正在尝试这样做，这是我目前最好的代码：

<md-toolbar color="primary">
    <nav md-tab-nav-bar>
        <a md-tab-link>
           This
        </a>
        <a md-tab-link>
            Looks
         </a>
         <a md-tab-link>
            really bad
         </a>
      </nav>
  </md-toolbar>

我知道我离这真的很远，但仍在努力实现它

不幸的是，我不能使用mdbootstrap，因为几乎所有好看的东西都需要bootstrap4，而我在整个项目中都使用bootstrap3。。所以升级会非常痛苦

谢谢你的帮助和评论
 您好，我的最佳解决方案是将
md选项卡导航栏
移出
md选项卡导航栏
。因此，您的示例如下所示：

<md-toolbar color="primary">
  some title
</md-toolbar>
<nav md-tab-nav-bar backgroundColor="primary">
  <a md-tab-link>
    This
  </a>
  <a md-tab-link>
    Looks
  </a>
  <a md-tab-link>
    really bad
  </a>
</nav>


一些头衔
这
看
真糟糕
您能否编辑您的帖子，以显示您试图模拟的导航栏的屏幕截图？这个页面上有几个。您好，不幸的是，它看起来仍然很糟糕，只是在屏幕很小的时候，它不会显示在汉堡菜单中。我知道它必须有导航开关和callopse等等。。。其他东西，但不幸的是它在这个结构中不起作用..折叠到汉堡包菜单需要一些额外的脚本。这是材料设计的一种例外，这就是为什么没有“开箱即用”的工作解决方案。材料设计最常见的场景是在工具栏中有预定义的“汉堡包”图标，并有相关的侧栏，单击图标将打开什么。这里有一些