沙盒/ctabber：修订间差异
更新日期： 2025-04-04 最新编辑：浮空港座头鲸
（创建页面，内容为“ <div class="ctab"> <ul class="ctab-tabs"> <li class="ctab-tab">外部标签1</li> <li class="ctab-tab">外部标签2</li> <li class="ctab-tab">外部标签3</li> </ul> <div class="ctab-content"> <div class="ctab-panel"> <p>这里是外部标签1的内容。</p> <!-- 嵌套的 ctab 示例 --> <div class="ctab"> <ul class="ctab-tabs"> <li class="ctab-tab">内部标签1</li> <li class="ctab-tab">…”） |
无编辑摘要 |
||
| 第1行： | 第1行： | ||
<div class="container mt-5"> | |||
<div class=" | <!-- 导航选项卡 --> | ||
<ul class="nav nav-tabs" id="myTab" role="tablist"> | |||
<li class="nav-item" role="presentation"> | |||
<button class="nav-link active" id="tab-home" data-bs-toggle="tab" data-bs-target="#home" | |||
type="button" role="tab" aria-controls="home" aria-selected="true">主页</button> | |||
</li> | |||
<li class="nav-item" role="presentation"> | |||
<button class="nav-link" id="tab-profile" data-bs-toggle="tab" data-bs-target="#profile" | |||
< | type="button" role="tab" aria-controls="profile" aria-selected="false">资料</button> | ||
</li> | |||
<li class="nav-item" role="presentation"> | |||
<button class="nav-link" id="tab-contact" data-bs-toggle="tab" data-bs-target="#contact" | |||
type="button" role="tab" aria-controls="contact" aria-selected="false">联系</button> | |||
</li> | |||
</ul> | |||
<!-- 选项卡内容 --> | |||
<div class="tab-content" id="myTabContent"> | |||
<div class="tab-pane fade show active p-3" id="home" role="tabpanel" aria-labelledby="tab-home"> | |||
<h3>主页内容</h3> | |||
<p>这里是主页选项卡的内容。</p> | |||
</div> | |||
<div class="tab-pane fade p-3" id="profile" role="tabpanel" aria-labelledby="tab-profile"> | |||
<h3>资料内容</h3> | |||
<p>这里是资料选项卡的内容。</p> | |||
</div> | |||
<div class="tab-pane fade p-3" id="contact" role="tabpanel" aria-labelledby="tab-contact"> | |||
<h3>联系内容</h3> | |||
<p>这里是联系选项卡的内容。</p> | |||
</div> | </div> | ||
</div> | </div> | ||
</div> | </div> | ||
2025年4月4日 (五) 15:56的最新版本
主页内容
这里是主页选项卡的内容。
资料内容
这里是资料选项卡的内容。
联系内容
这里是联系选项卡的内容。