.form-control 只能在某些 <input> type 元素上使用。

当我们使用一个 <input> 元素是, .form-control 只能 用在 <input> 的 type 是文本模式下, 即:

• <input type="text">
• <input type="password">
• <input type="search">
• <input type="number">
• <input type="email">
• <input type="url">
• <input type="tel">
• <input type="datetime-local">, <input type="date">, <input type="month">, <input type="week">, <input type="time">
• <input type="color">

相反, .form-control 不能 不能用在 <input> 的非文本模式下, 即:

• <input type="file">
  • Bootstrap v3 不提供这些样式。
• <input type="range">
  • Bootstrap v3 不提供这些样式。
• <input type="image">
  • Bootstrap v3 不提供这些样式。
  • 请注意，这本质上是将一个图像变成一个按钮。它与让用户选择要输入的图像文件无关。
• <input type="button">, <input type="submit">, <input type="submit">
  • 使用 .btn (或者 .btn-block)类在 <input> 的按钮样式上，而不是 .form-control。
• <input type="checkbox">, <input type="radio">
  • 使用 .checkbox 或 .radio 类 (不要直接作用在 <input> 元素上) 来渲染样式，而不是 .form-control。
• <input type="hidden">
  • 你一开始就不应该尝试这样做。

.form-control 类不能在任意HTML元素上使用。它只能用于 <input>, <textarea>, 和 <select> 上。

错误的:

<button class="form-control">None of</button>
<div class="form-control">these</div>
<span class="form-control">make any</span>
<a class="form-control">sense!</a>

正确的:

<input type="text" class="form-control" value="Text input" />
<textarea class="form-control">Text area</textarea>
<select class="form-control">
  <option>Option 1</option>
  <option>Option 2</option>
  ...
</select>