navbar-header：导航的头部，一般情况下用来放置logo
navbar-brand ：用来放置logo，需要配合navbar-header使用
具体代码：
<!doctype html> <html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta content="width=device-width, initial-scale=1"> <title>Bootstrap</title> <link href="https://www.jb51.net/css/bootstrap.css" /> </head> <body> <!--有链接和文字的导航条--> <nav> <div><!--将外围的div放在nav标签里面--> <div> <a href="#">logo</a><!--navbar-brand 用来放置logo的--> </div> <ul> <li><a href="#" >苹果</a></li> <li><a href="#" >香蕉</a></li> <li><a href="#" >橘子</a></li> </ul> <a href="#">链接</a><!--navbar-link为导航里的链接--> <p>这里是一段文字</p><!--navbar-text为导航里的文字--> <ul><!--右对齐，而navbar-left为左对齐--> <li><a href="#" >登录</a></li> <li><a href="#" >注册</a></li> </ul> </div> </nav> <!--有表单的导航条--> <nav> <div> <div> <a href="#">logo</a> </div> <ul> <li><a href="#" >苹果</a></li> <li><a href="#" >香蕉</a></li> <li><a href="#" >橘子</a></li> </ul> <button>搜索</button> <form action="URL"><!--navbar-form是在导航条里添加表单，navbar-left使表单左浮动，使其与其他内容在一行显示--> <input type="text"/> <button>搜索</button> </form> <ul> <li><a href="#" >登录</a></li> <li><a href="#" >注册</a></li> </ul> </div> </nav> <script src="https://www.jb51.net/js/jquery-2.1.0.js"></script> <script src="https://www.jb51.net/js/bootstrap.js"></script> </body> </html>
效果图：
