在终端设备多种多样的今天，响应式已成为必然趋势，今天分享一下响应式的导航条。
想到响应式的框架，Bootstrap肯定首当其冲，网格系统利用媒体查询，更好的实现了多种屏幕尺寸的适应。
说道导航条，在pc上正常展示肯定是没问题的，但是在中小屏幕，甚至超小屏幕上该如何应用呢，Bootstrap,结合js实现了折叠导航的效果。
PC设备上的导航：
在平板，移动设备上的导航：
导航条代码
其中，最后一个导航设置了右浮动，但在中小屏幕下清楚了，使他能够更好的折叠。
关于Bootstrap，慕课网有很详细的课程，其中对导航栏的讲解也很详细，（如果上述代码有不清楚的地方，建议看看Bootstrap的课程）。
在此感谢《Bootstrap实战》,书中详细讲解了响应式导航的实现，以及一些less文件的修改。
演示地址：https://marlborokay.github.io/NavBar/
文件地址：https://github.com/marlboroKay/NavBar
在此分享给大家。
