1

我在我的页面中使用 Bootstrap 导航选项卡,如下所示:

<div class="container-fluid">

     <div class="row-fluid">
        <div class="span2">
        </div>
        <div class="span10">
            <!--Body content-->


<div class='row>
  <div class='span8'>
    <ul class="nav nav-tabs" id="myTab">
      <li class="active"><a href="#home">Home</a></li>
      <li><a href="#profile">Profile</a></li>
    </ul>

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

    <script>
      $(function () {
        $('#myTab a:last').tab('show');
      })
    </script>
  </div>
</div>


        </div>
     </div>
</div>

我想在我的选项卡窗格中组织一个网格,我试过这个:

<div class='row'>
    <div class='span4'>...</div>
    <div class='span4'>...</div>
</div

在窗格内,但这不起作用。

如何使用引导程序在我的选项卡窗格中嵌套列?

4

1 回答 1

0

这对我有用 http://jsfiddle.net/rKaaq/

<div class="row">
  <div class="span8">
    <ul class="nav nav-tabs" id="myTab">
      <li class="active"><a href="#home">Home</a></li>
      <li><a href="#profile">Profile</a></li>
    </ul>

    <div class="tab-content">
      <div class="tab-pane active" id="home"></div>
      <div class="tab-pane" id="profile">
      <div class="row">
        <div class="span4">This is some text that spans4</div>
        <div class="span4">This is some more text that spans 4</div>
       </div>  
      </div>
    </div>

    <script>
      $(function () {
        $('#myTab a:last').tab('show');
      })
    </script>
 </div>
</div>
于 2012-11-29T18:57:15.490 回答