forms - Bootstrap 3表单输入元素的大小属性不会改变相同的长度

Question

使用 Bootstrap 3，表单输入元素大小不会按照 size 属性指定的方式更改，代码片段:

<input class="form-control" id="exampleInputEmail1" placeholder="Enter email" type="email" size="50">

我知道有一些解决方法可以缩短输入元素的长度，但是，请帮助我理解为什么它不能与 input 元素的 size 属性一起使用？

工作代码为 bootply 。

谢谢!

Answer 1

您可以做几件事。您可以使用 Bootstrap 的 col-*类来更改表单的布局方式，或者您可以修改 CSS 或向输入添加内联样式(例如 <input ... style="width:200px;"> )。

我个人会尝试使用 col-*类以保持一致性，即使它为页面添加了更多标记。举个例子，像这样:

<form role="form">
  <div class="form-group">
    <label for="exampleInputEmail1" class="col-sm-4">Email address</label>
    <div class="col-sm-8">
      <input class="form-control" id="exampleInputEmail1" placeholder="Enter email" size="50" type="email">
    </div>
  </div>
...

我还尝试遵循 the Bootstrap docs 中的文档和示例.