Question

是否需要使用col-sm-9在第二个div中制作12个col或者我可以使用col-sm-4使输入字段变小。是否有其他方法可以在bootstrap形式中使输入字段变小class =“形横”。

<form class="form-horizontal">
            <div class="form-group">
               <label for="label" class="col-sm-3 control-label">Label</label>
               <div class="col-sm-9">        
                  <input class="form-control textLabel" type="text" id="label" autocomplete="off"/>
               </div>
            </div>             
    </form>

Answer 1

我无法发表评论，所以我将此作为答案。据我了解，你必须连续12列，句号（编辑：我似乎不正确，请参阅注释）。因此，您需要添加一个在所需宽度列之后不占用空间的列：

<form class="form-horizontal">
    <div class="form-group">
       <label for="label" class="col-sm-3 control-label">Label</label>
       <div class="col-sm-5" style = "width: 20%;">        
          <input class="form-control textLabel" type="text" id="label" autocomplete="off"/>
       </div>
       <div class="col-sm-4" style = "width:0px; height:0px;">        
       </div>
    </div>             
</form>
<div class = "row">
    <div class = "col-sm-12" style = "background-color:red;">TESTING FOR RESIZE BEHAVIOR</div>
</div>

除非您不想使用纯粹的自举进行尺寸调整，否则您甚至不需要额外的色谱柱。你可以简单地留下sm-9，但是指定宽度：

<div class="col-sm-9" style = "width: 20%;">        
    <input class="form-control textLabel" type="text" id="label"   autocomplete="off"/>
</div>

Bootstrap网格系统：您是否必须拥有12列或可以使用更少的列

1 个答案: