Text 如何在bootstrap 3中自定义输入字段宽度

在删除了诸如

input xlarge

和

input large

等关键功能后，在bootstrap 3中它的替代品是什么

当然，我可以使用

col-lg-12

等，但这在选项卡窗格中给出了一个错误

---

我也可以使用

style=“width:30px；

”但是它会失去响应能力，不像

input xlarge

。有什么建议吗？

你可以使用这些类

输入lg

输入

及

输入sm

对于输入字段，将按钮的输入替换为btn

检查此文档

这将只更改元素的高度，以减少宽度，您必须使用网格系统类，如

col xs-*col md-*col lg-*

---

示例

col-md-3

。请参见Bootstrap 3中的doc

。表单控件（您提供输入的类）的宽度为100%，允许您将其包装到col-lg-X div中进行排列。文档中的示例：



看下面

它与Bootstrap 2.3.2有点不同，但您很快就会习惯它。
我在主css文件中用
最大宽度
解决了这个问题

/* Set width on the form input elements since they're 100% wide by default */
input,
select,
textarea {
    max-width: 280px;
}

这是一个简单的解决方案，几乎没有“代码”

col-xs-2
col-xs-3
col-xs-4

您可以通过使用class input sm来创建它。正确的方法确实是使用col-md-X（参见下面的答案）。请澄清您的“选项卡窗格”（我不知道您的意思）有什么问题。这些类不会更改输入元素的宽度。@eddiegroves这将只更改元素的高度，为了减少宽度，您必须使用网格系统类，如
.col xs-*.col md-*.col lg-*
。示例
col-md-3
。请参见此处的文档注意，通过向表单添加
.form horizontal
，您可以使用引导的预定义网格类在水平布局中对齐表单控件的标签和组。这样做会将
.form groups
更改为网格行，因此不需要
.row
-。建议的样式会弄乱分组输入。
  <form role="form">
    <div class="form-group">
      <div class="col-xs-2">
        <label for="ex1">col-xs-2</label>
        <input class="form-control" id="ex1" type="text">
      </div>
      <div class="col-xs-3">
        <label for="ex2">col-xs-3</label>
        <input class="form-control" id="ex2" type="text">
      </div>
      <div class="col-xs-4">
        <label for="ex3">col-xs-4</label>
        <input class="form-control" id="ex3" type="text">
      </div>
    </div>
  </form>

<div class="form-group">
                    <div class="input-group col-md-5">
                    <div class="input-group-addon">
                    <span class="glyphicon glyphicon-envelope"></span> 
            </div>
                        <input class="form-control" type="text" name="text" placeholder="Enter Your Email Id" width="50px">

                    </div>
                    <input type="button" name="SIGNUP" value="SIGNUP">
            </div>