2015-08-08 50 views
0

這樣,引導3:如何在一行上製作導航標籤和按鈕?

| tab1 | tab2 | tab3 |         button 


<div class="row"> 
    <ul class="nav nav-tabs"> 
    <li role="presentation" class="active"><a href="#">Home</a></li> 
    <li role="presentation"><a href="#">Profile</a></li> 
    <li role="presentation"><a href="#">Messages</a></li> 
    </ul> 
    <div class="btn-group pull-right"> 
    <button class="btn btn-default navbar-btn pull-right" >123</button> 
    </div> 
</div> 

回答

0

如果要放置多個單元以單行您可以使用引導網格系統。有關詳細信息,請參閱:http://getbootstrap.com/examples/grid/

您的代碼然後可以像:

<div class="row"> 
    <div class="col-xs-8"> 
     <ul class="nav nav-tabs"> 
      <li role="presentation" class="active"><a href="#">Home</a> 
      </li> 
      <li role="presentation"><a href="#">Profile</a> 
      </li> 
      <li role="presentation"><a href="#">Messages</a> 
      </li> 
     </ul> 
    </div> 
    <div class="col-xs-4"> 
     <div class="btn-group pull-right"> 
      <button class="btn btn-default navbar-btn pull-right">123</button> 
     </div> 
    </div> 
</div> 

用於加工例如在這裏看到:https://jsfiddle.net/qmjmtx27/1/

相關問題