在boostrap

Question

在bootstrap中，我们可以通过设置一个名为btn-group-lg的类来定义按钮组并创建更大的按钮：

<div class="btn-group btn-group-lg" role="group" aria-label="...">
  <button type="button" class="btn btn-default">Left</button>
  <button type="button" class="btn btn-default">Middle</button>
  <button type="button" class="btn btn-default">Right</button>
</div>

此标记有以下结果：

我想知道是否有办法让它像这样：

Answer 1

删除btn-group btn-group-lg类。使用可以根据您的布局和需求编辑此代码。

<div class="col-md-1">  
<button type="button" class="btn btn-default">Right</button>
</div>
 <div class="col-md-1">  
<button type="button" class="btn btn-default">Right</button>
</div>
 <div class="col-md-1" style="clear:left">   
<button type="button" class="btn btn-default">Right</button>
</div>
 <div class="col-md-1">  
<button type="button" class="btn btn-default">Right</button>
</div>

Answer 2

<!-- Similar layout in medium size screen-->
<div class="col-md-4 col-md-offset-8"> 
 <div class="row">
  <div class="col-md-6">
     <button type="button" class="btn btn-default">Right</button>
  <div/>
  <div class="col-md-6">
     <button type="button" class="btn btn-default">Right</button>
  <div/>
 <div/>
 <div class="row">
  <div class="col-md-6">
    <button type="button" class="btn btn-default">Right</button>
  <div/>
  <div class="col-md-6">
    <button type="button" class="btn btn-default">Right</button>
  <div/>
 <div/>
<div/>