bootstrap(5)关于导航

关于导航

首先说明一点，在Bootstrap中的导航组件都依赖于同一个.nav类，状态类是共用的，下面添加的nav样式都是基于 .nav的基类上添加的

1，导航样式

导航样式代码如下：

<ul  class="nav nav-tabs">
           <li role="presentation" class="active"><a href="#">Home</a></li>
           <li role="presentation"><a href="#">Profile</a></li>
           <li role="presentation"><a href="#">Messages</a></li>
</ul>

标签页：

.nav-tabs 

标签页是下面这种效果：

胶囊式标签：

.nav-pills

胶囊式标签是下面这种效果

2,通过在后面添加类名为  class="stacked"可以实现标签页的垂直效果

3，通过添加class="nav-justified"可以实现响应式效果

当屏幕宽度大于768px的时候，标签可以实现水平效果，当宽度小于768px的时候，标签则会发生重叠效果

bootstrap(5)关于导航

原文：http://www.cnblogs.com/qianduangaoshou/p/6847757.html