twitter-bootstrap - 如何使表单元素在 bootstrap3 中正确排列？

Question

我想组织以下内容：

FORM
TEXTBOX1

TEXTBOX2  TEXTBOX3

假设我从以下结构开始，那么正确的方法是什么：

<form>
<label...>
<input type="text">
<label...>
<input type="text">
<label...>
<input type="text">
</form>

我看到 class="form-inline"内联表单中的 make 元素，但我只希望第二个和第三个文本框内联，而不是全部 3。处理这个问题的正确方法是什么？

Answer 1

试试这个演示，如果你想实现列http://jsfiddle.net/tVHMy/2/

相关摘录：

<div class='row'>
    <div class='col-sm-6'>
        <div class='form-group'>
            <label for="user_password">Password</label>
            <input class="form-control" id="user_password" name="user[password]" size="30" type="password" />
        </div>
    </div>
    <div class='col-sm-6'>
        <div class='form-group'>
            <label for="user_password_confirmation">Password confirmation</label>
            <input class="form-control" id="user_password_confirmation" name="user[password_confirmation]" size="30" type="password" />
        </div>
    </div>
</div>

Answer 2

<form class="form-horizontal">                                                                                                                            
  <div class="row "> 
    <div class="col-sm-12">                                                     
    <input type="text" class="form-control" placeholder="TextBox1"/>
    </div>                                  
  </div>                                              

  <div class="row">        
     <div class="col-sm-6">                                              
      <input class="form-control"  type="text" placeholder="TextBox2"/>                                                                     
     </div>
     <div class="col-sm-6"> 
      <input class="form-control" type="text" placeholder="TextBox3"/>  
     </div>                                            
   </div>                                                      
 </div>                                                    
</form>

使用上面的代码片段来获得所需的格式