引导程序导航下拉列表

时间:2016-08-19 22:18:49

标签: html twitter-bootstrap-3 navigation

我想尝试建立一个基本的bootstrap网站。 我设法完成了我的第一次,但当我尝试制作一个新的时,我似乎无法正确设置下拉菜单

一般下拉菜单(小屏幕)不起作用。而社交媒体"两者都不是。

<body>


<!-- Navbar -->

<div class ="navbar navbar-inverse navbar-static-top">
  <div class ="container-fluid">
  <div class ="navbar-header">
      <a href="#" class="navbar-brand">Titel</a>       
      <button class="navbar-toggle" data-toggle="collapse" data-target=".navHeaderCollapse">
      <span class="icon-bar"></span>
      <span class="icon-bar"></span>
    <span class="icon-bar"></span>


      </button> 
      </div>

     <div class="collapse navbar-collapse navHeaderCollapse">

          <ul class ="nav navbar-nav navbar-right">
      <li><a href="#">Home</a></li>
      <li><a href="#">About</a></li>
      <li class="dropdown">
          <a href="#" class="dropdown-toggle" data-toggle="dropdown">
          Social Media <b class="caret"></b>
          </a>   
          <ul class="dropdown-menu">
          <li>Twitter</li>
              <li>Twitter</li>
              <li>Twitter</li>
              <li>Twitter</li>
          </ul>
        </li>

<li><a href="#">Contact</a></li>


      </ul>

          </div>
  </div>




  </div>


 </div>


 <script src = "http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src = "js/bootstrap.js"></script>
</body>

0 个答案:

没有答案