响应式汉堡导航栏在django base.html中不起作用

Question

我正在开发一个简单的博客网站，我面临的问题是我的导航栏没有响应，下面是在桌面上看到的我的导航栏。

但是随着我减小浏览器的大小，导航栏被隐藏了

我需要的是单击鼠标左键以减小所有导航栏菜单项在垂直方向上可见时的屏幕顶部的汉堡图标。

下面是我的代码：

public function store(Request $request) { 

    $this->validate($request, [
        'practice'=>'required|max:100',
        'project'=>'required',
        'work_place'=>'required',
        'telephone_1'=>'required',
        'date_recurring_for_beginning' => 'required|date',
        'date_recurring_for_end' => 'required|date|after_or_equal:date_recurring_for_beginning',
        ]);

    RequestCollaborator::create($request->all());

    return redirect()->route('requestsCollaborator.index')
        ->with('flash_message',
            trans('request.request_created'));
}

我尝试到处搜索并自行测试，但我自己做不到。

任何帮助将不胜感激！

谢谢！

Answer 1

您需要添加一个切换按钮才能拥有汉堡菜单

在您的情况下

类似于

<header role="banner">
  <nav class="navbar navbar-expand-md  navbar-light bg-light">
      <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarMenu" aria-expanded="false" aria-label="Toggle navigation">
        <span class="navbar-toggler-icon"></span>
      </button>
      <div class="collapse navbar-collapse" id="navbarMenu">
        ...
      </div>
    </div>
</header>
...