Question

我花了一个小时试图将我的css应用于表单内类型文本的Bootstrap输入。这是我的代码：

<form>
  <div class="form-group">
    <input type="text" name="username" value="" id="username" class="form-control" />
  </div>
</form>

input [type=text] {
  background-color: red !important;
}

奇怪的是，如果我删除了[type=text]部分，那么一切都还可以。

JSFiddle

Answer 1

您必须删除input和[type=text]之间的空格：

input[type=text] {
  background-color: red !important;
}

<input type="text"/>
<input type="password"/>

Answer 2

您的背景拼写错误并删除空格。

input [type=text] {
  barckground-color: red !important;
}

所以请确保输入正确。

input[type=text] {
  background-color: red !important;
}

Answer 3

嗨试试这个希望我可以帮助你：

    <div class="form-group">
        <label for="usr">Name:</label>
        <input type="text" class="form-control" id="usr">
        <input type="text" name="username" placeholder="input username">
    </div>
    <div class="form-group">
        <label for="pwd">Password:</label>
        <input type="password" class="form-control" id="pwd">
        <input type="text" name="password" placeholder="input password">
    </div>
</form>

将自定义css应用于Bootstrap输入类型文本

3 个答案: