导航栏(Bootstrap)
2017-01-16 20:45
274 查看
<nav class="navbar navbar-default"> <div class="container"> <div class="navbar-header"> <a href="index.html" class="navbar-brand">海涛高软</a> </div> <ul class="nav navbar-nav navbar-left"> <li><a href="index.html"><span class="glyphicon glyphicon-home"></span> 后台首页</a></li> <li class="active"><a href="user_list.html"><span class="glyphicon glyphicon-user"></span> 用户管理</a></li> <li><a href="content.html"><span class="glyphicon glyphicon-list-alt"></span> 内容管理</a></li> <li><a href="tag.html"><span class="glyphicon glyphicon-tags"></span> 标签管理</a></li> </ul> </div> </nav>
最后效果图如下:
注意:
1 除一个类是以nav开头的外,其它的都是以navbar开头的 2 要重视ul元素摆在左还是右,要用navbar-left和navbar-righ,不要去考虑用pull-left或pull-right
FR:徐海涛(Hunk Xu)
相关文章推荐
- Bootstrap学习-bootstrap渲染表单+bootstrap导航栏
- BootStrap实现响应式布局导航栏折叠隐藏效果(在小屏幕、手机屏幕浏览时自动折叠隐藏)
- Bootstrap导航栏下拉菜单鼠标滑过展开
- Bootstrap<基础十七>导航栏
- 【一点一滴Bootstrap】导航栏
- bootstrap34-带有导航栏的字体图标
- Html 5/CSS 的学习(二) —— Bootstrap 导航栏
- bootstrap-导航栏
- bootstrap导航栏
- bootstrap导航栏如何跟随页面跳转而变化
- Bootstrap多级导航栏(级联导航)的实现代码
- Bootstrap<基础十七>导航栏
- bootstrap定义导航栏
- Bootstrap3.3.5响应式导航栏 实例
- Bootstrap 导航栏和登陆框
- 详解bootstrap导航栏.nav与.navbar区别
- bootstrap中使用Affix时,顶部导航栏出现位置偏移的问题
- [置顶] bootstrap自定义样式-bootstrap侧边导航栏的实现
- 自定义bootstrap样式-9行样式自定义漂亮大气bootstrap导航栏
- Bootstrap学习--导航栏