gpt4 book ai didi

css - UI Bootstrap tabset 显示选项卡的内容

转载 作者:行者123 更新时间:2023-11-28 07:49:15 25 4
gpt4 key购买 nike

首先:我完全不熟悉 bootstrap。我想使用 vertical tabset将内容显示在选项卡的右侧。我的想法草图:

Hand sketch of idea

<tabset vertical="true" type="tabs">
<tab heading="Vertical 1">Vertical content 1</tab>
<tab heading="Vertical 2">Vertical content 2</tab>
</tabset>

但不幸的是我没能解决这个 css 命令。

最佳答案

性感图片:D

<div class="col-xs-3"> <!-- required for floating -->
<!-- Nav tabs -->
<ul class="nav nav-tabs tabs-left"><!-- 'tabs-right' for right tabs -->
<li class="active"><a href="#home" data-toggle="tab">Home</a></li>
<li><a href="#profile" data-toggle="tab">Profile</a></li>
<li><a href="#messages" data-toggle="tab">Messages</a></li>
<li><a href="#settings" data-toggle="tab">Settings</a></li>
</ul>
</div>
<div class="col-xs-9">
<!-- Tab panes -->
<div class="tab-content">
<div class="tab-pane active" id="home">Home Tab.</div>
<div class="tab-pane" id="profile">Profile Tab.</div>
<div class="tab-pane" id="messages">Messages Tab.</div>
<div class="tab-pane" id="settings">Settings Tab.</div>
</div>
</div>

http://dbtek.github.io/bootstrap-vertical-tabs/learn.html

关于css - UI Bootstrap tabset 显示选项卡的内容,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30529907/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com