1. 程式人生 > >Bootstrap 導航欄

Bootstrap 導航欄

添加 ava cal str http .html 內容 target blog

Bootstrap 導航欄

  NavBar是對Nav的包含。在Nav之外還做以下內容:

  1、根為 <nav class="navbar navbar-default">

  2、在Nav前添加頭 <div class="navbar-header"> <a class="navbar-brand">

  3、Nav的calss改 navbar-nav

  

<nav class="navbar navbar-default">
    <div class="container-fluid">
    <
div class="navbar-header"> <a class="navbar-brand" href="#">菜鳥教程</a> </div> <div> <ul class="nav navbar-nav"> <li class="active"><a href="#">iOS</a></li> <li><a href="#">SVN</a></
li> <li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown"> Java <b class="caret"></b> </a> <ul class="dropdown-menu"> <
li><a href="#">jmeter</a></li> <li><a href="#">EJB</a></li> <li><a href="#">Jasper Report</a></li> <li class="divider"></li> <li><a href="#">分離的鏈接</a></li> <li class="divider"></li> <li><a href="#">另一個分離的鏈接</a></li> </ul> </li> </ul> </div> </div> </nav>

2、折疊的導航

  

參考:http://www.runoob.com/bootstrap/bootstrap-navbar.html

Bootstrap 導航欄