2016-06-11 95 views
-1

我試圖用Bootstrap 3實現下面所示的設置,但是我無法完全找到一種方法來實現它,特別是要保持它的響應。我看了一下桌子和桌子等,但到目前爲止還沒有真正成功。Bootstrap表格佈局

enter image description here

+1

您添加類**表響應**? – XZKS

+3

你有試過什麼嗎?顯示你的HTML/CSS。 – makshh

回答

0

我到底琢磨出來。只是在面板中弄了一些亂七八糟的東西。

<div class="panel-group" id="accordion" role="tablist"> 

    <div class="panel panel-default container-fluid"> 
     <div class="row panel-heading "> 
      <div class="col-sm-1 pull-left"></div> 
      <div class="col-sm-4 col-xs-12">Asset ID</div> 
      <div class="col-sm-2 col-xs-12">Status</div> 
      <div class="col-sm-2 col-xs-12">Asset Nodes</div> 
      <div class="col-sm-3 col-xs-12">Manage</div> 
     </div> 
    </div> 

    <div class="panel panel-default container-fluid"> 
     <div class="panel-heading row" role="tab" id="headingOne"> 
      <div class="col-xs-1"> 
       <div data-toggle="collapse" class="handpointer glyphicon glyphicon-chevron-right"></div> 

      </div> 
      <div class="col-sm-4 col-xs-12"> 
       <a href="#">xxx</a> 
      </div> 
      <div class="col-sm-2 col-xs-12">Normal</div> 
      <div class="col-sm-2 col-xs-12">?</div> 
      <div class="col-sm-3 col-xs-12"><a class="btn btn-xs btn-default" href="#" role="button">button</a></div> 
     </div> 
     <div id="collapseOne" class="panel-collapse collapse in" role="tabpanel" aria-labelledby="headingOne"> 
      <div class="panel-body"> 
       dsfsdfd 
      </div> 
     </div> 
    </div> 

</div> 

http://www.bootply.com/NLxmcWu4SJ