bootstrap框架 导航条组件使用

本文记载boot 导航条组件使用方法

导航条组件

• 导航条是在您的应用或网站中作为导航页头的响应式基础组件。它们在移动设备上可以折叠（并且可开可关），且在视口（viewport）宽度增加时逐渐变为水平展开模式。
• 屏幕分辨率变化时，页面导航呈现不同效果，变小时会出现汉堡包按钮，将页面导航部分隐藏，以下拉列表的形式展示。

导航条使用

1. 引入相应文件
   bootstrap.min.css,bootstrap.min.js
2. 构建页面元素
   <!-- NAV元素 --> <nav class="navbar navbar-defualt"> <div class="container-fluid"> <!--汉堡包按钮部分--> <div class="navbar-header"> <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#下拉部分id"> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> <!--品牌logo部分--> <a href="#" class="navbar-brand">品牌LOGO</a> </div> <!--下拉部分--> <div class="collapse navbar-collapse" id="下拉部分id"> <!--这里可以放导航组件--> </div> </div> </nav>