码迷,mamicode.com
首页 > 其他好文 > 详细

浅谈Bootstrap——导航条起步

时间:2016-12-26 00:27:48      阅读:158      评论:0      收藏:0      [点我收藏+]

标签:toggle   代码   ace   contain   ack   put   关键字   简体   arch   

不多说,直接上代码。

<div class="navbar navbar-default">

  <div class="container">

   <div class="navbar-header">

     <a href="#" class="navbar-brand">

       <span class="logo"></span>

     </a>

     <a href="#menu" class="navbar-toggle" data-toggle="collapse">

       <span class="icon-bar"></span>

       <span class="icon-bar"></span>

       <span class="icon-bar"></span>

     </a>

   </div>

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

    <ul class="nav navbar-nav">    

      <li><a href="#">首页</a></li>
      <li><a href="#">新闻</a></li>

    </ul>

    <ul class="nav navbar-nav navbar-right">

      <li><a href="#">简体中文</a></li>

    </ul>

    <form class="navbar-form navbar-right">

      <div class="form-group has-feedback">

        <label class="sr-only" for="kw">搜索关键字:</label>

        <input id="kw" class="form-control" placeholder="请输入搜索关键字">

        <span class="glyphicon glyphicon-search form-control-feedback"></span>

      </div>

    </form>

   </div>    

  </div>

</div>

以上就是一个基于Bootstrap框架最简单的导航条

浅谈Bootstrap——导航条起步

标签:toggle   代码   ace   contain   ack   put   关键字   简体   arch   

原文地址:http://www.cnblogs.com/patcher/p/6220761.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!