胶囊式标签页

Boostrap制作胶囊标签页

1.把标签页分为页头选项卡和内容两部分。
2.页头使用ul标签，在ul中添加.nav和.nav-pills类，添加的.nav和.nav-pills类会应用胶囊标签样式，需要几个标签页就添加几个li标签。
3.在li标签中添加a标签，a标签中的href的值直接与标签页下面的内容div标签的id值关联。
4.在a标签中添加data-toggle=“pill”。
页头代码如下

<ul class="nav nva-pills">
	<li><a href="#id" data-toggle="pill">one</a></li>
</ul>

5.内容部分最外层使用div标签并添加.tab-content类，然后添加每个标签页对应的div标签，这些标签里面添加.tab-pane类和对应的id值，示例代码如下：

<div class="tab-content">
		<div class="tab-pane active" id="one">...</div