錯誤與助推器下拉

Question

我有這個問題，我的菜單不能與下拉與boostrap工作。這是我的代碼：

<nav role="navigation" class="col-sm-12"> 
 
    <div class="navbar-header"> 
 
     <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target=".navbar-collapse"> 
 
      <span class="sr-only">Toggle navigation</span> 
 
      <span class="icon-bar"></span> 
 
      <span class="icon-bar"></span> 
 
      <span class="icon-bar"></span> 
 
     </button> 
 

 
     <!--== Logo ==--> 
 
     <span class="navbar-brand logo"> 
 
     <img src="images/logo.png" alt="Rio Duero" title="Rio Duero"/> 
 
    </span> 
 

 
    </div> 
 
    <div class="navbar-collapse collapse" id="bs-example-navbar-collapse-1"> 
 

 
     <!--== Navigation Menu ==--> 
 
     <ul class="nav navbar-nav"> 
 
      <li class="current"><a href="#header">Home</a></li> 
 
      <li><a href="#empresa">Empresa</a></li> 
 
      <li><a href="#produccion">Zona Producción</a></li> 
 
      <li><a href="#biodinamico">Biodinámico</a></li> 
 
      <li><a href="#productos">Productos</a></li> 
 
      <li><a href="#certificaciones">Certificaciones</a></li> 
 
      <li><a href="#contacto">Contacto</a></li> 
 
      
 
     </ul> 
 
    </div> 
 
</nav>

我的網站，在這裏你可以看到的是：http://rioduero.cl/index23.php

Answer 1

請檢查你的頭，並用使用**Bootstrap CDN**

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/css/bootstrap.min.css"> 
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" ></script> 

<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.11.0/umd/popper.min.js" ></script> 

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/js/bootstrap.min.js" ></script> 

您的代碼正在工作請檢查它 https://jsfiddle.net/2017mb/gadxqgju/

Answer 2

確保選中添加下面這個鏈接

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/js/bootstrap.min.js" ></script> 

試試這一個下拉

<ul class="nav navbar-nav"> 
    <li class="current"><a href="#header">Home</a> 
    <ul> 
     <li><a href="#empresa">Empresa</a></li> 
    <li><a href="#produccion">Zona Producción</a></li> 
    <li><a href="#biodinamico">Biodinámico</a></li> 
    <li><a href="#productos">Productos</a></li> 
    <li><a href="#certificaciones">Certificaciones</a></li> 
    <li><a href="#contacto">Contacto</a></li> 
    </ul> 
    </li> 
</ul>