简体   繁体   English

对于Laravel,bootstrap navbar无法正常工作,只有一部分工作正常

[英]bootstrap navbar is not working properly for Laravel, only a part is working

I created a navbar from bootstrap inside resources/views/inc -> navbar.blade.php 我在resources / views / inc - > navbar.blade.php中的bootstrap中创建了一个导航栏

<nav class="navbar navbar-inverse navbar-fixed-top">
  <div class="container">
    <div class="navbar-header">
      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
        <span class="sr-only">Toggle navigation</span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>
      <a class="navbar-brand" href="/">Project</a>
    </div>
    <div id="navbar" class="collapse navbar-collapse">
      <ul class="nav navbar-nav">
        <li class="active"><a href="/">Home</a></li>
        <li><a href="/about">About</a></li>
        <li><a href="/contact">Contact</a></li>
      </ul>
    </div><!--/.nav-collapse -->
  </div>
</nav>

The first div tag is working fine but the second div tag is not visible in the output 第一个div标签工作正常,但第二个div标签在输出中不可见

And I properly include the navbar in a separate file inside resources/views/layouts -> app.blade.php 我正确地将导航栏包含在资源/视图/布局 - > app.blade.php中的单独文件中

<body>
    @include('inc.navbar')
    <div class="container">
        @yield('content')   
    </div>
</body>

Please help me with this 请在这件事上给予我帮助

edit 编辑

I removed class="collapse navbar-collapse" , then the navigation links are appearing, what is the issue with the compatibility on the collapse ? 我删除了class="collapse navbar-collapse" ,然后导航链接出现了, collapse兼容性有什么问题?

If you are referring to wanting this div to be visible immediately (without clicking): 如果你指的是希望这个div立即可见(不点击):

<div id="navbar" class="collapse navbar-collapse">...</div>

As it is, it is not meant to be visible upon load. 实际上,它并不意味着在加载时可见。 If you want it to load, you've got an extra collapse class in there, which is effectively hiding the div, remove it, and it should be visible for you: 如果你想要它加载,你有一个额外的崩溃类,它有效地隐藏div,删除它,它应该是你可见的:

<div id="navbar" class="navbar-collapse"> <-- No collapse

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM