zoukankan      html  css  js  c++  java
  • 浅谈Bootstrap——导航条起步

    不多说,直接上代码。

    <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框架最简单的导航条

  • 相关阅读:
    Ch04-文字列表的设计
    ch03-文字版面的设计
    ch02-HTML的基本概念
    【转】网站建设常用工具
    XSY1036 [Apio2012]派遣
    HDU1512 Monkey King
    快速构造FFT/NTT
    支配树学习笔记
    BZOJ1026[SCOI2009]windy数
    扩展欧几里得算法(exGCD)学习笔记
  • 原文地址:https://www.cnblogs.com/patcher/p/6220761.html
Copyright © 2011-2022 走看看