Bootstrapのnavタブ：正しいタグの使用方法

Bootstrapのnavタブでタブ切り替えを行う際、タグの選択は重要な要素となります。

tab-contentとtab-paneのクラスは、それぞれdivタグとともに使用することで正しく機能します。これらのクラスをulやliタグと一緒に使用した場合、タブの切り替えが正常に動作しない可能性があります。

例えば、以下のようなコードは正しく動作しません。

<ul class="tab-content">
  <li class="tab-pane active" id="home">...</li>
  <li class="tab-pane" id="profile">...</li>
</ul>

代わりに、以下のようにdivタグを使用します。

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