ブートストラップ入力タイプのテキストにカスタムCSSを適用する

Question

フォーム内でタイプテキストのブートストラップ入力にCSSを適用しようとして1時間を費やしました。ここに私のコードは次のとおりです。

<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]一部を削除した場合、すべてがOKであるということです。

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

こんにちは私はあなたを助けることができるこの1人の希望を試してみてください：仕事 `における誤植について

<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>