响应式导航条:在PC和平板中默认要显示所有的内容;但在手机中导航条中默认只显示“LOGO/Brand”,以及一个“菜单折叠展开按钮”,只有单击折叠按钮后才显示所有的菜单项。
基础class: .navbar
1、Bootstrap中导航条的按位置:
1)顶部导航条
2)底部导航条
Bootstrap中导航条的按颜色:
1)浅色底深色的字 .navbar-default
2)深色底浅色的字 .navbar-inverse
Bootstrap中导航条的按定位:
1)相对定位position: relative 默认值
2)固定定位position: fixed .navbar-fixed-top/bottom
2、导航条的结构:
<div >
<div >
<!--导航条的头部:商标+按钮-->
<div >
<a >
<button >
</div>
<!--导航条折叠菜单:菜单、按钮、搜索框、链接、文本...-->
<div >
<ul >
<form >
<button >
<span >
<a >
</div>
</div>
</div>
原标题:Bootstrap组件之响应式导航条
关键词: