html - 使用引导站点创建菜单

Question

我想创建一个这样的菜单：http: //getbootstrap.com/getting-started/ 我尝试了许多课程和样式，但没有得到回应。

Answer 1

这非常简单，只需添加bootstrap css、bootstrap.js和jQuery（之前bootstrap.js）并使用该css文件中定义的类，并且它已完全记录在您所指的站点本身中。这里只是一个例子：

    <header class="navbar navbar-inverse navbar-fixed-top bs-docs-nav" role="banner">
    <div class="container">
    <div class="navbar-header">
        <button class="navbar-toggle" type="button" data-toggle="collapse" data-target=".bs-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>
      <a href="../" class="navbar-brand">My Menu</a>
    </div>
    <nav class="collapse navbar-collapse bs-navbar-collapse" role="navigation">
        <ul class="nav navbar-nav">
            <li class="active">
                <a href="#">Page One</a>
           </li>
           <li>
              <a href="#">Page Two</a>
           </li>
           <li>
               <a href="#">Page Three</a>
           </li>
        </ul>
    </nav>
  </div>
</header>

下载上面提到的这些文件（或从cdn使用）并将css文件保存在你的head标签中

<link href="css/bootstrap.min.css" rel="stylesheet" media="screen">

js并在结束正文标记之前跟随文件，例如

<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="//code.jquery.com/jquery.js"></script>
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="js/bootstrap.min.js"></script>

为了清楚地理解，请查看此基本模板部分。