Twitter bootstrap 3 引导3表单响应

下面的fiddle显示了一个示例表单，它有3个“列”，每个列都有一个标签和一个输入。

标题1：

当屏幕缩小时，所有列都折叠成垂直形式（标题在顶部，输入在底部）。

---

我如何（如果可能的话）做出表单响应是这样的：当屏幕缩小但没有缩小到智能手机大小时，只有第三列折叠。因此，从本质上讲，表单将有2列，而不是3列。然后，当屏幕缩小到智能手机大小时，所有列都会折叠成垂直形式。

使用

col-sm-3

和

col-md-2

   <div class="form-group">
     <label for="txtField1" class="col-sm-2 control-label">Caption 1:</label>
   <div class="col-sm-2">
      <input type="text" id="txtField1" name="txtField1" class="form-control" />
   </div>