Bootstrap Tab选项卡参考

Tab选项卡 CSS 类

选项卡用于将内容分为不同的窗格，每个窗格一次可见。

下表总结了 Bootstrap Tab选项卡 CSS 类：

类名	描述	示例
.nav nav-tabs	创建导航选项卡	尝试一下
.nav nav-pills	创建一个药丸菜单	尝试一下
.nav-justified	对齐宽度相等的标签/药丸链接	尝试一下
.nav-link	用于在导航栏中设置链接/锚的样式	尝试一下
.nav-item	用于为导航栏中的列表项设置样式	尝试一下
.tab-content	与.tab-pane一起使用以创建可切换tab选项卡	尝试一下
.tab-pane	与.tab-content一起使用以创建可切换tab项	尝试一下

无

下表列出了所有可用的Tab选项卡方法。

方法	描述	示例
.tab("show")	显示tab 选项卡	尝试一下

下表列出了所有可用的Tab选项卡事件。

提示：使用 jQuery 的event.target 和 event.relatedTarget 获取激活选项卡和上一个激活选项卡：

$('.nav-tabs a').on('shown.bs.tab', function(event){
    var x = $(event.target).text();        
    var y = $(event.relatedTarget).text(); 
});

尝试一下