选项卡中的选项卡中的嵌套选项卡 Bootstrap

Question

我使用了来自 this SO question 的 Bootstrap 2.3.2 中的嵌套选项卡。

但我想使用最新的 Bootstrap Framework 3.3.6 甚至 4.x Alpha，但我没有更改任何类名，只更改了 CSS-、JS 和更新的 JQuery 文件的来源。

我的嵌套标签不应该有两个标签顺序，而是四个。 您可以在https://jsfiddle.net/ks93zdxk/3/查看我的当前状态

问题：

1. 我不知道，我是否可以/应该在此代码中将某些内容从 Bootstrap 2.3.2 更改为 Bootstrap 3.3.6。

2. 如果您在所有组合中单击“Passiv”，则三阶选项卡应与“Aktiv”中的选项卡具有相同的位置，它们具有相同的名称，但 ID 不同。 单击“transitiv（Hilfsverb avoir）”时，我遇到了同样的问题。这里的二阶选项卡也应该具有与“intransitiv (Hilfsverb être)”相同的位置，它们也具有相同的名称，但 ID 不同。 我认为一些</div>-tags 必须在其他行，但我不知道它们应该在哪里。

Answer 1

基本上，你做对了，但是你在 HTML 标签的嵌套中犯了一些错误：<div class="tab-content"> 需要包裹在任何一组 <div class="tab-pane"> 周围。

<div class="tab-content">
  <div class="tab-pane fade active in" id="etre-voice-gender1111">
    <p>Tab 1.1.1.1 être Aussage aktiv männlich</p>
  </div>
  <div class="tab-pane fade" id="etre-voice-gender1112">
    <p>Tab 1.1.1.2 être Aussage aktiv weiblich</p>
  </div>
</div>

Example corrected.

您应该咨询official documentation。

Des salutations aus der Schweiz.