1.导航
class 为
- nav nav-tabs标签式的导航菜单
- nav nav-pills基本的胶囊式导航菜单
- pagination分页导航
- pager翻页导航
- breadcrumb面包屑导航
导航中如果有默认选中的多一个这个属性class="active"
示意代码
<ul class="nav nav-tabs"> <li> <a href="#">Home</a></li> <li><a href="#">SVN</a></li> <li><a href="#">iOS</a></li> <li><a href="#">VB.Net</a></li> <li class="active"><a href="#">Java</a></li> <li><a href="#">PHP</a></li> </ul>
2.下拉菜单
具体代码示意:
<div class="dropdown"> <!-- 按钮 --> <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown"> 喜欢的频道 <!-- 下拉箭头的图标 --> <span class="caret"></span> </button> <!-- 下拉菜单列表 --> <ul class="dropdown-menu"> <li class="dropdown-header">——综艺——</li> <li><a href="#">乘风破浪的姐姐们</a></li> <li><a href="#">奇葩说</a></li> <li><a href="#">中国有嘻哈</a></li> <li class="divider"></li> <li class="dropdown-header">——电影——</li> <li><a href="#">姜子牙</a></li> <li><a href="#">肖生克的救赎</a></li> <li><a href="#">杀手不太冷</a></li> </ul> </div>